单击复选框并调用其'.click()'函数有什么区别？

Question

请考虑以下代码:

HTML:

<input type='checkbox' />
<div>Click here</div>

JS:

$(function() {
    $('input').click(function() {
        document.write($(this).is(':checked') ? "checked" : "unckecked");
    });
    $('div').click(function() {
        $('input').click();
    });
});

单击复选框时,输出为checked,但如果单击"单击此处",则输出为unckecked.这是为什么？

Answer 1

因为click事件与事件不同,change事件是元素更改的地方.当<div>a执行a时.click()触发click尚未更改复选框状态的事件,因此当它检查时,它处于先前状态.

当你点击直接的<input>,你已经改变了状态,即使change为了事件触发2,主要的一点是复选框checked状态已经改变,以前的click处理程序是检查它,所以国家是最新的.

如果您想要准确的状态信息查找并触发change事件,请执行以下操作:

$(function() {
    $('input').change(function() {
        $("span").append("<br />" + (this.checked ? "Checked" : "Uncecked"));
    });
    $('div').click(function() {
        $('input').click().change();
    });
});

你可以在这里尝试一下,关于偶然性这不是一个行为问题而你想要一个外部可点击区域,这就是我要做的事情(通过<label>包装输入).