复选框在<李>html条目-与用于折叠/展开列表项的javascript结合使用

Checkbox unclickable inside <li> html entry - breaks in conjunction with javascript used to collapse/expand list items

本文关键字：列表 结合 javascript 用于 gt lt html 条目 复选框 折叠      更新时间：2023-09-26

我发现一些代码可以很好地折叠和扩展我的列表项，因为我不希望在页面显示时立即显示整个列表：

$(function(){
 $('li:has(ul)').click(function(event){
      if(this==event.target){
       $(this).css('list-style-image',(!$(this).children().is(':hidden'))?'url(plus.gif)':'url(minus.gif)');
       $(this).children().toggle('fast');
      }
       return false;
     })
     .css({cursor:'pointer','list-style-image':'url(plus.gif)'}).children().hide();
     $('li:not(:has(ul))').css({cursor:'default','list-style-image':'none'});
});
</script>

我添加了一些带有文本框的列表项，但现在我也需要复选框。当我在列表项中添加复选框时，它将变得不可点击。

我已经把它缩小到上面的代码把复选框搞砸了。有没有什么我可以用代码修改的东西，这样它就可以选中复选框？

问题是return false，它在jQuery事件处理程序中等效于event.preventDefault()和event.stopPropagation()。把它评论出来，它就起作用了。

这是经过编辑的工作小提琴。

相关文章：