JavaScriptを使用してチェックボックスの値を動的に変更する際の問題

Patweb

正常に機能するフォームにチェックボックスがあります。フォームがクリックされたとき、値を1に変更しようとしています。クリックされていないとき、値はゼロである必要があります。JavaScriptを使用して動的にフィールドに入力しています。問題は、コンソールにログインすると、空の値が表示されることです。

チェックボックスフィールド

function checkMark() {
  var checkBox = document.getElementById("spouse");

  if (checkBox.checked == true){
    checkBox.value = '1';
  } else {
    checkBox.value = 'O';
  }
}

var spouse = $('#spouse').val();
console.log(spouse);

    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="spouse" value="" class="spouse" onclick="checkMark()">

ミハイアレクサンドル-イオヌット

問題の理由は、ページが最初にロードされたときにログを記録しているためですを変更するたびに結果ログに記録する必要がありcheckboxます。

また、ternaryソリューションを簡素化するために演算子を使用することもできます

function checkMark() {
     var checkBox = document.getElementById("spouse");
     checkBox.value = checkBox.checked ? '1' : '0';
     log();
}

function log(){
     var spouse = $('#spouse').val();
     console.log(spouse);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="spouse" value="" class="spouse" onclick="checkMark()">

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

javascriptを使用してテキストボックスの背景色を変更する際の問題

分類Dev

jqueryを使用してクリック時にボタンのhtmlコードを変更する際の問題

分類Dev

チェックボックスを使用してリストのクリック動作を変更する

分類Dev

reactonchangeを使用してチェックボックスの変更を動的に処理する方法

分類Dev

javascriptを使用して、同じIDとクラスを持つすべてのチェックボックスの中で特定の値を持つチェックボックスを設定することに関する問題

分類Dev

チェックボックスをDOMに動的に追加する際の有線の問題

分類Dev

バッチスクリプトでWMICを使用してPCの名前を変更する際の問題

分類Dev

javascriptを使用してチェックボックスの値を動的に取得する方法

分類Dev

shinyWidgetsを使用してチェックボックスの色を変更する

分類Dev

JSのチェックボックスでSwitchCaseを使用する際に問題が発生する

分類Dev

jqueryを使用してチェックボックスを設定するのに問題がある

分類Dev

子の1つをチェック解除するときにすべてのチェックボックスの選択を解除する際の問題

分類Dev

ReactでuseStateを使用してチェックボックスの値を変更する方法

分類Dev

チェックボックスのチェック/チェックを外して配列を変更する

分類Dev

Selenium + Javaを使用してWebページのすべてのチェックボックスを選択する際の問題

分類Dev

laravel 5.3 でボタンまたはチェックボックスを使用して多対多の関係を保存する際の問題

分類Dev

チェックボックスがsetEnable(true)を使用しているときに.setTextColorの色を変更する

分類Dev

innerHTMLを使用してチェックボックスに基づいてdiv値を変更する

分類Dev

javascriptを使用してコンボボックスの値を選択し、有効にするチェックボックスを無効にします

分類Dev

チェックボックスからの入力を使用してボタンの色を変更する

分類Dev

onChange属性を使用して、チェックボックスの値をインラインで変更します

分類Dev

javascriptとjqueryを使用してチェックボックスの値をオフにする

分類Dev

Powershellを使用してO365ユーザーメールボックスを共有メールボックスに変換する際の問題

分類Dev

チェックボックスの変更時にテキストボックスの値を追加/削除する

分類Dev

チェックボックスの値に基づいて要素の可視性を変更するには?

分類Dev

チェックされていないチェックボックスの値0を変更する方法

分類Dev

InternetExplorerのチェックボックスをダブルクリックする際の問題

分類Dev

同じIDの複数の行を使用してoptionsMenuの値を変更して、チェックボックスをオンにします

分類Dev

チェックボックスの値に基づいてテキストを変更する

Related 関連記事

  1. 1

    javascriptを使用してテキストボックスの背景色を変更する際の問題

  2. 2

    jqueryを使用してクリック時にボタンのhtmlコードを変更する際の問題

  3. 3

    チェックボックスを使用してリストのクリック動作を変更する

  4. 4

    reactonchangeを使用してチェックボックスの変更を動的に処理する方法

  5. 5

    javascriptを使用して、同じIDとクラスを持つすべてのチェックボックスの中で特定の値を持つチェックボックスを設定することに関する問題

  6. 6

    チェックボックスをDOMに動的に追加する際の有線の問題

  7. 7

    バッチスクリプトでWMICを使用してPCの名前を変更する際の問題

  8. 8

    javascriptを使用してチェックボックスの値を動的に取得する方法

  9. 9

    shinyWidgetsを使用してチェックボックスの色を変更する

  10. 10

    JSのチェックボックスでSwitchCaseを使用する際に問題が発生する

  11. 11

    jqueryを使用してチェックボックスを設定するのに問題がある

  12. 12

    子の1つをチェック解除するときにすべてのチェックボックスの選択を解除する際の問題

  13. 13

    ReactでuseStateを使用してチェックボックスの値を変更する方法

  14. 14

    チェックボックスのチェック/チェックを外して配列を変更する

  15. 15

    Selenium + Javaを使用してWebページのすべてのチェックボックスを選択する際の問題

  16. 16

    laravel 5.3 でボタンまたはチェックボックスを使用して多対多の関係を保存する際の問題

  17. 17

    チェックボックスがsetEnable(true)を使用しているときに.setTextColorの色を変更する

  18. 18

    innerHTMLを使用してチェックボックスに基づいてdiv値を変更する

  19. 19

    javascriptを使用してコンボボックスの値を選択し、有効にするチェックボックスを無効にします

  20. 20

    チェックボックスからの入力を使用してボタンの色を変更する

  21. 21

    onChange属性を使用して、チェックボックスの値をインラインで変更します

  22. 22

    javascriptとjqueryを使用してチェックボックスの値をオフにする

  23. 23

    Powershellを使用してO365ユーザーメールボックスを共有メールボックスに変換する際の問題

  24. 24

    チェックボックスの変更時にテキストボックスの値を追加/削除する

  25. 25

    チェックボックスの値に基づいて要素の可視性を変更するには?

  26. 26

    チェックされていないチェックボックスの値0を変更する方法

  27. 27

    InternetExplorerのチェックボックスをダブルクリックする際の問題

  28. 28

    同じIDの複数の行を使用してoptionsMenuの値を変更して、チェックボックスをオンにします

  29. 29

    チェックボックスの値に基づいてテキストを変更する

ホットタグ

アーカイブ