复选框在无序列表项中单击无法正常工作

我无法“检查”嵌入在可扩展UL中的输入复选框。 我知道原因与点击绑定有关,但我无法弄明白。

UL是动态的,所以我添加了新的li和UL。 最低级别UL包含应该可选择的lis。 但是当我尝试点击它们时,它只是突出显示标签,复选框永远不会被选中。

这是HTML:

 

这是javascript / jquery:

 function prepareList() { $('#expList').find('li:has(ul)') .click( function(event) { //If line item is expandable but has no line items then call the service to retrieve data if($(event.target).hasClass('collapsed') && $(event.target).find('li').length==0){ $(event.target).children('ul').append("Add New LI's") $('#expList').find('li:has(ul)').addClass('collapsed'); $('#expList').find('ul').addClass('inputslist'); $(event.target).find('li:has(input)').unbind(); $(event.target).children('ul').hide(); } //Toggle the lists if they show or not $(event.target).toggleClass('expanded'); $(event.target).children('ul').slideToggle('medium'); return false; }) .addClass('collapsed').removeClass('expanded').children('ul').hide(); }; $(document).ready( function() { prepareList() }); 

您从li click事件返回false ,因此事件永远不会到达复选框。 只需删除行return false; 从事件处理程序和复选框将正常工作。 这是一个jsFiddle 。