Ereignisdelegierter und verhindern, dass Blasen sein übergeordnetes Elementereignis auslösen

Sprechen Sie einfach über die Inbetriebnahme von Ereignissen und die Vorbeugung von Blasen

HTML:

 <ul data-type="cityPick"> <li data-id="0">All</li> <li data-id="88">New York</li> <li data-id="119">Los Angeles</li> <li data-id="138">Las Vegas</li> <li data-id="84">Hawaii</li> <li data-id="120">San Francisco </li> <li data-id = "105"> Orlando </li> <li data-id = "118"> Seattle </li> </ul>

JS:

 $ ("ul [Data-type = 'CityPick']"). on ('click', function () {alert ("übergeordnetes Element ul wird geklickt");}); $ ("ul [Data-type = 'CityPick']"). On ('Click', 'li', Funktion () {alert ("untergeordnetes Element li wird geklickt");});

Wenn Sie auf das spezifische Li -Element klicken, wird das Ereignis von UL ausgelöst, was wir nicht sehen möchten.

lösen:

 $ ("ul [Data-type = 'CityPick']"). on ('click', function () {alert ("übergeordnetes Element ul wird geklickt");}); $ ("ul [Data-type = 'CityPick']"). On ('Click', 'li', Funktion (e) {E.Stoppropagation (); // Bubble Alert ("untergeordnetes Element li wird geklickt");});

Fügen Sie einfach einen Satz hinzu, um Blasen zu stoppen.