Изменение .prop с помощью jQuery не вызывает событие .change

125

У меня есть прослушиватель событий на флажке:

<input type="checkbox" name="something">

Мой слушатель событий:

$('input[type="checkbox"][name="something"]').change(function() { 
    //DO SOMETHING 
});

У меня есть еще один прослушиватель событий, который меняет .propфлажок:

$('#button').click(function() { 
    $('input[type="checkbox"][name="something"]').prop("checked", false);
});

Когда я ставлю галочку, DO SOMETHINGсрабатывает. Когда я нажимаю на #button, .propизменения, и я вижу, что флажок визуально снят, но DO SOMETHINGне срабатывает ...

Что-то я не замечаю?

fuzzybabybunny
источник
возможный дубликат флажка, установленного с помощью prop (), не
запускает

Ответы:

196

Событие изменения запускается, когда значение изменяется при взаимодействии пользователя на странице, а не когда значение изменяется с помощью кода.

Здесь нужно использовать .change()или .trigger("change")после изменения свойства:

$('input[type="checkbox"][name="something"]').prop("checked", false).change();

Рабочая демонстрация

Милинд Анантвар
источник
2
Я думал, что propпозаботился о генерации событий изменения?
Gone Coding
1
Прохладно. Спасибо. Хорошая демонстрация, подтверждающая концепцию. +1 Спасибо.
Gone Coding
Спасибо! Итак, причина, по которой .prop (). Change () не работает с моей стороны, заключается в том, что я использую jQuery в MeteorJS, который имеет несколько другой способ вызова jQuery. Я попробовал по-вашему, и это сработало.
fuzzybabybunny
@fuzzybabybunny: это не из-за MeteorJS. prop () не запускает событие изменения.
Milind Anantwar
@MilindAnantwar, я делал .prop, а затем .change в коде Meteor ( Template.myTemplate.events), и это не сработало. Затем я поместил тот же самый код jQuery, Template.myTemplate.renderedи он работал нормально.
fuzzybabybunny