javascript - JQUERY ON ('change' ) 获取复选框值和状态

Question

如何“获取”div“containerDIV”内更改的复选框？

查看:

@model MyModel

<div id="containerDIV">
<ul id="CheckBoxList">
@foreach (XObject t in MyModel.XCollection)
         {
         <li>
           <input type="checkbox" value="@t.id"/>
         </li>
         }
</ul>

在 JavaScript (Jquery) 方面，我有这个:

$('#containerDIV').on('change', '#CheckBoxList', function (event) {

    var id = $(this).val(); // this gives me null
    if (id != null) {
      //do other things
    }

});

很明显，$this不是复选框，而是div containerDIV或checkBoxList

如何获取复选框的状态和值？

Answer 1

如果您的输入在DOM加载后没有动态创建，您只需调用:

$('#CheckBoxList input[type=checkbox]').change(function() {

  var id = $(this).val(); // this gives me null
  if (id != null) {
    //do other things
  }

});

或者使用.on()，您只需定位被点击的input:

$('#CheckBoxList').on('change', 'input[type=checkbox]', function() {

  var id = $(this).val(); // this gives me null
  if (id != null) {
    //do other things
  }

});

FIDDLE