javascript - 以编程方式更改复选框不会触发更改事件

Question

我这里有以下代码:

$('input[type="checkbox"][id="gridlines"]').change(function () {
    alert('hello world');
});

$('#gridlines').prop('checked', true);

当我加载我的页面时，复选框被选中，但没有提示“hello world”。

但是，当我手动单击复选框时，系统会提示“hello world”。

什么给了？

Answer 1

您需要调用change()或使用 trigger()当通过代码更改值时触发 change 事件。

使用.change()

$('#gridlines').prop('checked', true).change();

使用.trigger()

$('#gridlines').prop('checked', true).trigger("change");