javascript - Javascript を使用してチェックボックスの値を設定する

Question

チェックボックスタグがあります。チェックボックス1としましょう:

<TL:FWCheckBoxTag bean="<%=abc %>"  tabindex="23"/>

チェックボックスがチェックされているかどうかに基づいて、チェックボックスに2つの異なる値(値属性)を送信したい。

たとえば、チェックボックスをオンにすると「aa」が送信され、チェックされていない場合は「bb」が送信されます。

どうすればできますか？

Answer 1

チェックボックスに追加できvalue="aa"ます。これは、ボックスがチェックされている場合に送信される値になります。ネイティブ チェックボックスには、「チェックされていない」値を送信する方法がありません。チェックされた値が欠落している場合はサーバー側をチェックするか、JavaScript の回避策を実装する必要があります。

JavaScript でこれを回避する 1 つの方法は、隠しフィールドに実際の値を設定し、イベントをチェックボックスに接続して隠しフィールドの値を切り替えることです。

jQuery を使用して回避策をフックするネイティブ HTML の例を次に示します。

<input type="hidden" name="myrealtextboxvalue" id="myrealtextboxvalue" value="bb"/>
<input type="checkbox" name="toggle" id="toggle"/> Check me

<script>
$(document).ready(function() {
   $("#toggle").change(function() {
      if($(this).is(":checked")) $("#myrealtextboxvalue").val("aa");
      else $("#myrealtextboxvalue").val("bb");
   });
});
</script>

次に、「myrealtextboxvalue」サーバー側を探して、「aa」または「bb」値を見つけます。

作業例: http://jsbin.com/agucer/1/edit

（入力を表示して、変更が行われるのを確認できるようにしました。上記のように type="hidden" を変更します）