对于用户和程序触发器,jQuery以不同的方式响应click()

时间:2010-05-24 14:09:00

标签: jquery events

以下是代码:

this.Form.find("input[type=checkbox]").click(function(event) {
    if ($(this).is(":checked")) {
        console.log("checked");
    }
    else {
        console.log("unchecked");
    }
});

如果未选中该复选框,并且我单击鼠标,则会“检查”。如果我以编程方式触发它$("#someCheckbox").click(),我会“取消选中”。如何使两者的行为方式相同?

4 个答案:

答案 0 :(得分:2)

看到你的评论后,我做了一些测试。我能够使用复选框上的DOM单击方法在FF和IE中按照您想要的方式工作,而不是触发jQuery单击事件。

<script type="text/javascript">
$(function() {
    $("input:checkbox").click( function() {
        if ($(this).is(':checked')) {
            alert('checked');
        }
        else {
            alert('not checked');
        }
    });
    $('a').click( function() {
        $('#cb').get(0).click();
        return false;
    });
});
</script>


<p>
<a href='#'>click a box</a>
</p>
<input id="cb" name="cb" type="checkbox" value="0" /> 0<br />

答案 1 :(得分:1)

这个问题来自一个相当棘手的事件处理时间问题深入jQuery的内容。这是一个blog post discussing it的详细信息(加上a link to the SO answer I got that post from)。

幸运的是,如果你要做的是以编程方式切换一个复选框并触发该复选框的绑定函数,那么你可以通过简单地交换.click(function(){}) .change(function(){})绑定来回避所有这些复杂功能。 1}}绑定。

click不同,对于change,绑定事件将始终按定义点击 点击导致复选框状态发生变化。该函数将始终看到新的复选框状态。

click类似,事件仅在点击式事件点击复选框后触发,因此在使用js操作复选框时,您仍然可以选择使用.attr()以静默方式更改点击状态, .removeAttr()不触发绑定函数,或.click()复选框触发绑定函数。

答案 2 :(得分:0)

当您点击复选框时,您将其状态从未选中状态更改为已选中状态,反之亦然。当触发click事件时,您只是使用false事件对象调用处理函数,实际上您并未更改状态。

在触发事件之前,请通过添加以下代码来切换复选框状态:

var myInput = $("input[type=checkbox]")[0];
myInput.checked = !myInput.checked;

您可能必须替换选择器才能使用您自己的代码。

答案 3 :(得分:0)

您可能希望查看它在Firefox和Internet Explorer中都有效。我在复选框中遇到了一些问题。 Check it out here!