[英]Parent / Child element bindings for click event
我正在使用jQuery tablesorter-我在每行上都有复选框,并且本质上希望在<th>
元素内具有“全选”复选框。
即使在该特定列上禁用了表排序器之后,我实际上也无法访问click事件。
简单的JS测试:
$('input[type="checkbox"].select-all').on("click", function(e){
console.log("Clicked!");
});
Click事件不执行任何操作,这就是为什么我认为tablesorter绑定到父<th>
元素的原因。 标头:
<tr>
<th class="no-sort"><input type="checkbox" class="select-all" /></th>
<th>Some Sortable title</th>
</tr>
关于如何访问该子复选框事件的任何想法? 我已将该列设置为不通过以下方式进行排序:
// Table-sort
var noSortHeaders = {};
$("table").find("th.no-sort").each( function(index, el){
noSortHeaders[ $(this).index() ] = {sorter: false};
});
$("table").tablesorter({
headers: noSortHeaders
});
如果复选框是在DOM ready
事件之后创建的,则您确实要使用事件委托。 我更喜欢change
事件而不是click
事件:
$(document).on('change', 'input[type=checkbox].select-all', function(e) {
console.log('Changed!');
});
或者,更好的是:
$('table').on('change', 'input[type=checkbox].select-all', function(e) {
console.log('Changed!');
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.