jQuery memeriksa kotak centang dan memicu peristiwa onclick javascript
Saya mencoba mencentang kotak centang menggunakan jQuery dan memicu peristiwa onclick dalam prosesnya.
Katakanlah saya memiliki kotak centang yang didefinisikan dalam html:
<input type="checkbox" value="checked" name="check1" onclick="alert(this.value);">Dan saya memiliki pernyataan jQuery yang dipicu dalam sebuah fungsi:
$('input[name=check1]').attr('checked', true);Hasilnya adalah kotak centang akan dicentang tetapi peristiwa onclick javascript tidak terpicu (sehingga tidak ada peringatan). Tetapi jika saya memicu klik bahkan secara manual seperti itu:
$('input[name=check1]').attr('checked', true).trigger('click');Hasilnya adalah kotak centang dicentang, javascript onclick event terpicu (dan nilainya didapat dengan benar) tetapi kemudian kotak centang tidak dicentang setelah itu.
Adakah yang bisa memberi tahu saya bagaimana saya bisa mencapai apa yang saya coba lakukan?
Gunakan .triggerHandler() sebagai pengganti .trigger():
$('input[name=check1]').attr('checked', true).triggerHandler('click');Juga, gunakan .prop() sebagai pengganti .attr():
$('input[name=check1]').prop('checked', true).triggerHandler('click');(jika Anda menggunakan jQuery 1.6 atau yang lebih baru.) edit & mdash; Selain itu, seperti yang saya komentari di jawaban lain, Anda harus berhati-hati terhadap perilaku aneh jQuery saat memicu kejadian secara terprogram. (
) Ketika sebuah "klik" nyata terjadi pada sebuah elemen, penangan "klik" untuk elemen tersebut akan melihat nilai yang diperbarui dari flag " dicentang". Artinya, jika Anda mengklik kotak centang yang tidak dicentang, penangan klik akan melihat flag "checked" yang disetel ketrue. Namun, jika Anda memicu "klik" pada kotak centang yang tidak dicentang melalui jQuery, penangan "klik" akan melihat bendera "dicentang" disetel ke "salah"! Menurut saya, ini adalah hal yang sangat buruk, tetapi memang selalu terjadi.
edit lagi & mdash; oh, saya juga lupa keanehan jQuery yang penting (dan menjengkelkan): untuk alasan yang tidak diketahui, API `.triggerHandler ()' hanya akan memanggil handler pada elemen yang pertama kali dicocokkan. Dengan kata lain, jika Anda mencoba untuk memicu semua penangan kotak centang "klik", dengan kata lain:
$('input:checkbox').triggerHandler('click');maka hanya kotak centang pertama pada halaman yang akan dipicu. Apa yang biasanya saya lakukan untuk mengatasi kegilaan ini adalah mengikat handler dengan nama event palsu saya sendiri dan juga "klik":
$('input:checkbox').bind('click my-click', function() ... ) // or ".on()" with 1.7Dengan cara itu saya dapat memicu "klik-ku &" dan mendapatkan yang terbaik dari kedua dunia: perpustakaan memicu penangan pada semua elemen yang cocok, tetapi tidak akan mengubah keadaan elemen yang sebenarnya.
Ganti:
$('input[name=check1]').attr('checked', true).trigger('click');Untuk:
$('input[name=check1]').trigger('click').prop('checked', true);
jawaban ini tampaknya berfungsi dengan baik:
$('input[nama=centang1]').attr('checked', true).change();
