Question

我在jQuery 1.4中遇到了一个带有click事件的奇怪行为。我们的想法是点击一个下拉列表（change()），然后使用click()函数将两个复选框反转两次。
如果我必须这样做，那是因为click on复选框更新了其他字段，所以我想而不是反转复选框checked属性，让我们只需要点击两次所有复选框。

尽管所有复选框都被正确反转了两次，但我在.length函数上使用的click在操作期间失去了正确的计数，并且每次都返回超过它应该的数量。

要明确这里代码的想法：

//The 'click' function
$('input:checkbox').click(function(){
    $(this).parent().find("input:checkbox:checked").length;//<- this one's not returning the right count
    //some code updating other fields thanks to the 'length' of the checkboxes
});

//The dropdown function
$('select.dropdown').change(function(){
    $(this).parent().find("input:checkbox").click();//Invert the first time
    $(this).parent().find("input:checkbox").click();//Invert a second time
});

当我手动检查并取消选中字段时，一切都运行正常，只是当下拉列表调用长度计数错误时。

以下是2个场景，可以更深入地解释我遇到的问题：

如果我从下拉列表中选择了某些内容（长度失败），然后取消选中并重新检查复选框，则计数正确。
如果我在click()函数的末尾添加一个错误的代码，除了在javascript调试器控制台上引发错误之外，它工作正常。顺便说一句，我无法保留这个解决方案，因为在这种情况下另一个功能失败了。

干杯，
尼古拉斯。

Answer 1

~~如果要反转复选框的checked状态，可以执行以下操作：~~

~~$(this).parent().find("input:checkbox").attr('checked', function(i, sel) { return !this.checked; });~~

~~请注意，调用.find("input:checkbox").attr(...会反转所有复选框。所以如果你把它叫两次，它们会被倒置两次，给你一个没有发生任何事情的外观。~~

修改

如果关键是您只想触发处理程序，则可以使用.triggerHandler()来触发click而不触发元素的默认行为。

$(this).parent().find("input:checkbox").triggerHandler('click');

http://api.jquery.com/triggerhandler/

Answer 2

假设复选框和下拉列表共享相同的表单，为什么不这样做...

function countCheckedBoxes(theForm){
    theForm.find("input:checkbox:checked").length;//<- this one's not returning the right count 
    //some code updating other fields thanks to the 'length' of the checkboxes 
}); 

//The 'click' function 
$('input:checkbox').click(function(){ 
    countCheckedBoxes($(this.form));
}); 

//The dropdown function 
$('select.dropdown').change(function(){ 
    countCheckedBoxes($(this.form));
});

然后你不依赖于以嵌套方式处理点击事件（我认为这是问题）并且你明确地运行'countCheckedBoxes（）'函数，而不是依赖于复选框的副作用点击。

来自click（）的click（）上的jQuery奇怪行为

2 个答案: