jQuery 更改事件不适用于复选框

Question

<tr>
  <td class="large-width">
    <p>
      <label>
        <input type="checkbox" id="checkbox" ${todo.isCompleted ? 'checked="checked"' : ''} />
        <span class="text">${todo.item}</span>
      </label>
    </p>
  </td>
</tr>

<script>
   $('#checkbox').change(function(){
     console.log('something');
   });
</script>

我可以看到复选框正在更改其状态，但 Change 事件不起作用。我还尝试了 ('change') 和点击事件 - 它们也不起作用。顺便说一句，我正在使用 materializecss.

Answer 1

将其保存在文档中准备就绪

<script>
$(function(ready){
   $('#checkbox').change(function(){
     console.log('something');
   });
});
</script>

Answer 2

需要调用以下 jQuery 方法来工作代码

$(document).ready(function(){ // jQuery methods go here... });

或

$(function(){ // jQuery methods go here... });

<tr>
  <td class="large-width">
    <p>
      <label>
        <input type="checkbox" id="checkbox" ${todo.isCompleted ? 'checked="checked"' : ''} />
        <span class="text">${todo.item}</span>
      </label>
    </p>
  </td>
</tr>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>$(document).ready(function(){
   $('#checkbox').change(function(){
     console.log('something');
   }); });
</script>

jQuery 更改事件不适用于复选框

jQuery change event is not working with checkbox

javascript

checkbox

jquery

materialize