La modifica di .prop utilizzando jQuery non attiva l'evento .change

125

Ho un listener di eventi su una casella di controllo:

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

Il mio ascoltatore di eventi:

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

Ho un altro listener di eventi che cambia .propla casella di controllo:

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

Quando controllo la casella di controllo si DO SOMETHINGattiva. Quando faccio clic su #button, le .propmodifiche e vedo la casella di controllo visivamente deselezionata, ma DO SOMETHINGnon viene attivata ...

Qualcosa che sto trascurando?

jquery

— fuzzybabybunny
fonte

l'eventuale duplicato della casella selezionata con prop () non

— attiva gli

196

L'evento di modifica viene generato quando il valore viene modificato dall'interazione degli utenti sulla pagina e non quando il valore viene modificato utilizzando il codice.

Qui è necessario utilizzare .change()o .trigger("change")dopo aver modificato la proprietà:

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

Demo funzionante

— Milind Anantwar
fonte

Pensavo che propsi occupasse della generazione di eventi di cambiamento?

— Gone Coding

Freddo. Grazie. Buona demo che dimostra il concetto. +1 Grazie.

— Gone Coding

Grazie! Quindi il motivo per cui .prop (). Change () non ha funzionato da parte mia è perché sto facendo jQuery in MeteorJS, che ha un modo leggermente diverso di chiamare jQuery. Ho provato esattamente a modo tuo e ha funzionato.

— fuzzybabybunny

@fuzzybabybunny: non è a causa di MeteorJS. prop () non attiva l'evento di modifica.

— Milind Anantwar

@MilindAnantwar, stavo facendo .prop seguito da .change nel codice Meteor ( Template.myTemplate.events) e non ha funzionato. Quindi ho inserito lo stesso codice jQuery esatto Template.myTemplate.renderede ha funzionato bene.

— fuzzybabybunny