jquery 以编程方式更改复选框不会激发更改事件

zpgglvta 于 2023-04-20 发布在 jQuery

关注(0)|答案(2)|浏览(151)

下面的代码是：

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

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

当我加载我的页面时，复选框被选中，但“hello world”不会得到提示。
然而，当我手动点击复选框时，“hello world”会被提示。
怎么回事？

2条答案

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

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

使用.trigger()

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

这就是它的工作原理，只有用户交互才能触发更改事件
您可以使用.change()/.trigger('change')手动触发它;

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

change
当用户提交对<input>、<select>和<textarea>元素值的更改时，将为这些元素触发change事件。与input事件不同，每次更改元素值时，都不必触发change事件。