为什么动态更改复选框不会触发表单更改事件？

Question

我写了这个javascript/jQuery片段来更改复选框. http://jsfiddle.net/johnhoffman/crF93/

使用Javascript

$(function() {
    $("a").click(function() {
       if ($("input[type='checkbox']").attr('checked') == "checked")
           $("input[type='checkbox']").removeAttr('checked');
       else
           $("input[type='checkbox']").attr('checked', 'checked');
       return false;
    });

    $("input[type='checkbox']").change(function(){ 
        console.log("Checkbox changed.");            
    });    
});?

HTML

<input type="checkbox" />
<a href="#">Change CheckBox</a>?

有趣的是,单击该链接会更改文本框,但不会触发表单更改事件,该事件会调用在Chrome Web Developer Console中记录消息的功能.为什么？我怎么做到这一点？

Answer 1

您需要触发更改事件,.trigger('change')以便事件知道发生了更改.

来自http://api.jquery.com/change/:

描述:将事件处理程序绑定到"更改"JavaScript事件,或在元素上触发该事件.

此方法是.on( "change", handler )前两个变体和.trigger( "change" )第三个变体的快捷方式.

在change当其值改变事件发送给一个元素.此事件仅限于<input>元素,<textarea>框和<select>元素.对于选择框,复选框和单选按钮,当用户使用鼠标进行选择时会立即触发事件,但对于其他元素类型,事件将延迟,直到元素失去焦点.

演示:

http://jsfiddle.net/nPkPw/3/

使用链接:http://jsfiddle.net/nPkPw/5/
ie$("input[type='checkbox']").trigger('change').attr('checked', 'checked');

Answer 2

这并不奇怪,但我猜你可以这样到msdn中的非效果列表.

• "当提交内容时会触发此事件,而不是在值发生变化时触发此事件."
• "当以编程方式更改选定对象的选定选项时,onchange事件不会触发."

你可以永远只是.click()它jsFiddle