Rumah  >  Artikel  >  hujung hadapan web  >  Apakah peristiwa menggelegak dalam jquery

Apakah peristiwa menggelegak dalam jquery

青灯夜游
青灯夜游asal
2022-11-18 18:52:301867semak imbas

Peristiwa menggelegak ialah selepas peristiwa berlaku, penyemak imbas biasanya mencetuskan pengendali acara pada elemen di mana peristiwa itu berlaku dahulu, kemudian elemen induknya, elemen induk elemen induk...dan seterusnya, sehingga dokumen sehingga elemen akar. Peristiwa menggelegak ialah cara penyebaran acara yang paling biasa; selepas memproses acara, jika anda ingin menghentikan penyebaran acara dan tidak mahu ia terus menggelegak, anda mesti mengikat kaedah pemprosesan acara.

Apakah peristiwa menggelegak dalam jquery

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 3.6.1, komputer Dell G3.

Apakah peristiwa menggelegak

Peristiwa menggelegak ialah jika jenis peristiwa tertentu dicetuskan pada objek, peristiwa itu akan Merambat ke induk dan mencetuskan peristiwa serupa yang ditakrifkan pada objek induk. Arah perambatan peristiwa adalah dari bawah ke atas, sama seperti gelembung air yang naik dari dasar air.

Dokumen HTML boleh menggambarkan pepohon DOM:

Apakah peristiwa menggelegak dalam jquery

Kemudian fenomena menggelegak acara boleh diwakili dengan jelas sebagai rajah berikut:

Apakah peristiwa menggelegak dalam jquery

Dalam istilah mudah:

Selepas peristiwa berlaku, penyemak imbas biasanya mencetuskan pengendali peristiwa terlebih dahulu pada elemen tempat peristiwa itu berlaku, kemudian pada elemen induknya, dan kemudian pada elemen induk elemen induk… …dan seterusnya, sehingga elemen akar dokumen.

Ini dipanggil acara menggelegak dan merupakan cara yang paling biasa untuk acara disebarkan. 当处理好一个事件后, 你可能想要停止事件的传播,不希望它继续冒泡。就要绑定该事件的处理方法。

Apakah peristiwa menggelegak dalam jquery

Seperti yang ditunjukkan di atas, tetapkan acara klik untuk mereka Apabila butang diklik, peristiwa klik butang dicetuskan dan div elemen induk yang sepadan dicetuskan untuk mengklik acara, kemudian mencetuskan badan untuk mencetuskan acara, dan seterusnya sehingga dokumen atau tetingkap.

Contoh menggelegak

Program:

Apakah peristiwa menggelegak dalam jquery

Kesan:

Apakah peristiwa menggelegak dalam jquery

Apabila anda mengklik pada kotak merah di mana tiga terletak, kotak pop timbul tiga muncul Selepas pengesahan, kotak pop timbul dua muncul dan kemudian kotak pop timbul satu muncul.

Apabila anda mengklik pada kotak kuning di mana dua terletak, kotak pop timbul dua akan muncul, dan kemudian kotak pop timbul satu akan muncul.

Apabila anda mengklik kotak hijau di mana satu terletak, hanya satu kotak pop timbul akan muncul.

Iaitu, menggelegak berlaku dalam dua situasi pertama.

Jika seseorang mengatakan ia disebabkan oleh susunan peristiwa klik yang ditulis, itu tidak berlaku, semuanya dilaksanakan selepas dokumen dimuatkan.

Kaedah untuk mengelakkan menggelegak:

Jika anda ingin mengelakkan menggelegak berikutnya selepas mengklik dua, tambahkan yang berikut

Apakah peristiwa menggelegak dalam jquery

Kemudian kotak pop timbul dua tidak akan muncul lagi.

Jquery menghalang kejadian menggelegak acara

1 Batalkan gelagat lalai dan menghalang peristiwa menggelegak dengan mengembalikan palsu.

Kod jQuery:

$("form").bind(
  "submit", 
  function() { 
    return false;
   }
);

2. Hanya batalkan tingkah laku lalai dengan menggunakan kaedah preventDefault().

Kod jQuery:

$("form").bind(
  "submit", 
  function(event){
      event.preventDefault();  
  }
);

3. Hanya halang satu peristiwa daripada menggelegak dengan menggunakan kaedah stopPropagation().

Kod jQuery:

$("form").bind(
  "submit", 
  function(event){
      event.stopPropagation();  
  }
);

[Pembelajaran yang disyorkan: tutorial video jQuery, video bahagian hadapan web]

Atas ialah kandungan terperinci Apakah peristiwa menggelegak dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn