Question

在我的HTML文件中，我有以下列表：

<ul >
       <li > <input type="checkbox" name="cbox" >do assignment 3</li>
        <li> <input type="checkbox" name="cbox" >study for test</li>
        <li > <input type="checkbox" name="cbox" >buy groceries</li>
        <li ><input type="checkbox" name="cbox">do more work</li> 
      </ul>

我的javascript文件中有以下功能：

     $list.on('click', 'li', function() {
      var $this = $(this);
      ..some code
 }

老实说，我觉得js文件中的其余代码非常重要，所以我只想问一下我对此感到困惑。

我注意到，无论何时我选中复选框，它都会将其视为我点击该列表项，因此该函数被调用。无论如何要将它分开，以便选中或取消选中复选框并不会自动与单击列表项相同吗？我认为可能没有，因为复选框代码被<li> </li>标签包围。这是否意味着......以某种方式成为li元素的一部分（或一个孩子？不确定术语）？如果是这样，这是否意味着我应该能够使用$ this？

我尝试过$ this.is（＆＃39;：已检查＆＃39;）但似乎总是返回false。

Answer 1

event.stopPropagation()

描述：防止事件冒泡DOM树，防止任何父处理程序被通知事件。

有关详情，请查看Documentation

Answer 2

尝试在.is()处理程序中使用click检查点击的元素是否为input type="checkbox"

 $list.on("click", "li", function() {
    // if element clicked is not `input type="checkbox"` , do stuff
    if (!$(this).is(":checkbox")) {
      var $this = $(this);
      // ..some code
    }
 })

我可以使用此选项访问此复选框吗？

2 个答案: