Bagaimana untuk mengelakkan preventdefault() daripada berkuat kuasa

Kaedah untuk menghalang lalai() daripada berkuat kuasa: 1. Gunakan proksi acara ialah teknologi yang menambahkan pendengar acara kepada elemen induk dan kemudian mencetuskan peristiwa pada elemen anak melalui acara menggelegak untuk Mengubah suai atau mencegah kelakuan lalai acara semasa dalam perjalanan; kaedah preventDefault().

Dalam penyemak imbas, kaedah preventDefault() sering digunakan untuk menghalang tingkah laku lalai acara. Sebagai contoh, anda mungkin menggunakan kaedah ini apabila anda ingin menyesuaikan gelagat mengklik pautan atau menyerahkan borang, dan bukannya membenarkan penyemak imbas melakukan navigasi lalai atau gelagat penyerahan borang.

Walau bagaimanapun, jika anda ingin menghalang kaedah preventDefault() daripada berkuat kuasa, anda mungkin perlu menggunakan beberapa teknik yang lebih kompleks, kerana JavaScript tidak menyediakan kaedah langsung untuk membuat asal atau mengatasi kelakuan preventDefault().

1. Gunakan proksi acara

Proksi acara ialah teknik yang menambahkan pendengar acara kepada elemen induk dan kemudian mencetuskan peristiwa pada elemen anak melalui acara menggelegak. Dengan cara ini anda boleh mengubah suai atau menghalang gelagat lalai acara semasa ia menggelegak.

Berikut ialah contoh mudah:

document.body.addEventListener('click', function(event) {  
  if (event.target.tagName === 'BUTTON' && event.target.textContent === 'Prevent Default') {  
    event.stopPropagation();  // 阻止事件冒泡，从而阻止默认行为  
  }  
});  
  
document.body.innerHTML = &#39;<button>Prevent Default</button><div>Some content</div>&#39;;

Dalam contoh ini, apabila anda mengklik butang, penyemak imbas cuba mencetuskan gelagat klik lalai (seperti menavigasi ke pautan atau menyerahkan borang). Tetapi kerana kami menyekat penyebaran acara semasa ia menggelegak, gelagat lalai tidak dicetuskan.

Walau bagaimanapun, kaedah ini tidak menghalang tingkah laku lalai peristiwa yang telah dipanggil kaedah preventDefault(). Oleh kerana kaedah preventDefault() dipanggil dalam pengendali acara, setelah pengendali acara selesai dijalankan, acara telah disekat. Anda tidak boleh menukar hasil ini selepas pengendali acara telah dijalankan.

2.Pembolehubah bendera

Jika anda perlu memutuskan sama ada untuk menghalang kelakuan lalai acara berdasarkan syarat dalam pengendali acara yang sama, anda mungkin perlu menggunakan pembolehubah bendera untuk mengawal panggilan ke preventDefault() kaedah. Contohnya:

var preventDefault = false;  
  
document.body.addEventListener('click', function(event) {  
  if (event.target.tagName === 'BUTTON' && event.target.textContent === 'Prevent Default') {  
    preventDefault = true;  
  } else if (preventDefault) {  
    event.preventDefault();  
  }  
});  
  
document.body.innerHTML = &#39;<button>Prevent Default</button><div>Some content</div>&#39;;

Dalam contoh ini, apabila anda mengklik butang, pembolehubah preventDefault akan ditetapkan kepada benar. Kemudian apabila pengendali acara memproses elemen lain, ia menyemak nilai pembolehubah preventDefault dan memanggil kaedah preventDefault() mengikut keperluan. Dengan cara ini anda boleh menghalang kelakuan lalai acara berdasarkan syarat dalam pengendali acara yang sama.

Atas ialah kandungan terperinci Bagaimana untuk mengelakkan preventdefault() daripada berkuat kuasa. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!