226

だから私は次のようなコードを持っています:

<input class="messageCheckbox" type="checkbox" value="3" name="mailId[]">
<input class="messageCheckbox" type="checkbox" value="1" name="mailId[]">

現在チェックされているチェックボックスの値を取得するには、Javascriptが必要です。

編集:追加するには、チェックボックスが1つしかありません。

4

13 に答える 13

310

上記のどれも私にとってはうまくいきませんでしたが、単にこれを使用してください:

document.querySelector('.messageCheckbox').checked;
于 2015-03-27T13:19:40.117 に答える
301

最新のブラウザの場合:

var checkedValue = document.querySelector('.messageCheckbox:checked').value;

を使用してjQuery

var checkedValue = $('.messageCheckbox:checked').val();

なしの純粋なJavaScriptjQuery

var checkedValue = null; 
var inputElements = document.getElementsByClassName('messageCheckbox');
for(var i=0; inputElements[i]; ++i){
      if(inputElements[i].checked){
           checkedValue = inputElements[i].value;
           break;
      }
}
于 2012-07-22T11:06:03.337 に答える
131

コードでこれを使用しています。これを試してください

var x=$("#checkbox").is(":checked");

チェックボックスがオンの場合はxtrue になり、それ以外の場合は false になります。

于 2013-09-02T13:01:44.440 に答える
18

プレーンJavaScriptで:

function test() {
    var cboxes = document.getElementsByName('mailId[]');
    var len = cboxes.length;
    for (var i=0; i<len; i++) {
        alert(i + (cboxes[i].checked?' checked ':' unchecked ') + cboxes[i].value);
    }
}
function selectOnlyOne(current_clicked) {
    var cboxes = document.getElementsByName('mailId[]');
    var len = cboxes.length;
    for (var i=0; i<len; i++) {
        cboxes[i].checked = (cboxes[i] == current);
    }
}
于 2012-07-22T11:02:44.330 に答える
5

$(document).ready(function() {
  var ckbox = $("input[name='ips']");
  var chkId = '';
  $('input').on('click', function() {
    
    if (ckbox.is(':checked')) {
      $("input[name='ips']:checked").each ( function() {
   			chkId = $(this).val() + ",";
        chkId = chkId.slice(0, -1);
 	  });
       
       alert ( $(this).val() ); // return all values of checkboxes checked
       alert(chkId); // return value of checkbox checked
    }     
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="checkbox" name="ips" value="12520">
<input type="checkbox" name="ips" value="12521">
<input type="checkbox" name="ips" value="12522">

于 2016-08-10T15:16:59.040 に答える
3

これを使って:

alert($(".messageCheckbox").is(":checked").val())

これは、チェックするチェックボックスにクラス「messageCheckbox」があることを前提としています。そうでない場合は、入力がチェックボックスタイプであるかどうかをチェックする必要があります。

于 2012-07-22T10:57:42.393 に答える
0

純粋な JavaScript と最新のブラウザ

// for boolean
document.querySelector(`#isDebugMode`).checked

// checked means specific values
document.querySelector(`#size:checked`)?.value ?? defaultSize

<form>
  <input type="checkbox" id="isDebugMode"><br>
  <input type="checkbox" value="3" id="size"><br>
  <input type="submit">
</form>

<script>
  document.querySelector(`form`).onsubmit = () => {
    const isDebugMode = document.querySelector(`#isDebugMode`).checked
    const defaultSize = "10"
    const size = document.querySelector(`#size:checked`)?.value ?? defaultSize
    //  for defaultSize is undefined or null
    // const size = document.querySelector(`#size:checked`)?.value
    console.log({isDebugMode, size})
    return false
  }
</script>

于 2021-11-10T03:58:18.543 に答える