Bagaimana untuk Menjejaki Perubahan dalam Kumpulan Butang Radio Merentasi Pelayar?

Penyelesaian Rentas Pelayar untuk Acara Perubahan dalam Kumpulan Butang Radio

Dalam kumpulan butang radio yang berbilang input berkongsi nama yang sama, acara onChange boleh menjadi tidak boleh dipercayai untuk menjejaki perubahan. Ini kerana onChange tidak menyala apabila butang radio dinyahpilih.

Penyelesaian: Perwakilan Acara dan Pengurusan Negeri

Satu penyelesaian ialah menggunakan perwakilan acara dan pengurusan negeri untuk menjejaki butang radio yang disemak sebelum ini. Dengan menambahkan pendengar acara tunggal pada borang yang mengandungi butang radio, kami boleh menangkap semua peristiwa perubahan dan mengemas kini keadaan kami dengan sewajarnya:

<code class="javascript">var rad = document.myForm.myRadios;
var prev = null;

for (var i = 0; i < rad.length; i++) {
    rad[i].addEventListener('change', function() {
        (prev) ? console.log(prev.value): null;
        if (this !== prev) {
            prev = this;
        }
        console.log(this.value)
    });
}</code>

Skrip ini memberikan setiap butang radio sebagai pendengar acara perubahan. Apabila perubahan berlaku, ia mencatatkan nilai butang radio yang disemak sebelum ini (jika ada) sebelum mengemas kini pembolehubah 'sebelumnya' untuk merujuk kepada butang radio yang disemak semasa.

Pendekatan Ganti

• Acara menggelegak boleh digunakan dan bukannya delegasi acara langsung. Dalam pendekatan ini, pendengar acara ditambahkan pada elemen borang, dan acara menggelembung ke borang apabila butang radio diklik. Walau bagaimanapun, pendekatan ini mungkin mempunyai implikasi prestasi.
• Acara klik boleh digunakan sebagai sandaran untuk onChange. Walaupun peristiwa klik dicetuskan tanpa mengira sama ada butang radio ditandakan atau dinyahtanda, ia tidak mempunyai konteks keadaan kumpulan butang radio.

Atas ialah kandungan terperinci Bagaimana untuk Menjejaki Perubahan dalam Kumpulan Butang Radio Merentasi Pelayar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!