Mengubah .prop menggunakan jQuery tidak memicu peristiwa .change

125

Saya punya pendengar acara di kotak centang:

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

Pendengar acara saya:

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

Saya memiliki pendengar acara lain yang mengubah .propkotak centang:

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

Ketika saya mencentang DO SOMETHINGpemicu kotak centang . Ketika saya mengklik #button, .propperubahan dan saya melihat kotak centang secara visual tidak dicentang, tetapi DO SOMETHINGtidak dipicu ...

Sesuatu yang saya abaikan?

fuzzybabybunny
sumber

Jawaban:

196

Peristiwa perubahan diaktifkan saat nilai diubah oleh interaksi pengguna di halaman dan bukan saat nilai diubah menggunakan kode.

Di sini Anda perlu menggunakan .change()atau .trigger("change")setelah mengubah properti:

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

Bekerja Demo

Milind Anantwar
sumber
2
Saya pikir propmengurus generasi acara perubahan?
Gone Coding
1
Keren. Terima kasih. Demo bagus membuktikan konsepnya. +1 Terima kasih.
Gone Coding
Terima kasih! Jadi alasan mengapa .prop (). Change () tidak berfungsi di pihak saya adalah karena saya melakukan jQuery di MeteorJS, yang memiliki cara yang sedikit berbeda untuk memanggil jQuery. Saya mencobanya dengan cara Anda dan berhasil.
fuzzybabybunny
@fuzzybabybunny: ini bukan karena MeteorJS. prop () tidak memicu peristiwa perubahan.
Milind Anantwar
@MilindAnantwar, saya melakukan .prop diikuti dengan .change dalam kode Meteor ( Template.myTemplate.events) dan tidak berhasil. Saya kemudian meletakkan kode jQuery yang sama persis di bawah Template.myTemplate.rendereddan itu berjalan dengan baik.
fuzzybabybunny