jQuery event.stopImmediatePropagation() Method
The jQuery event.stopImmediatePropagation() is an inbuilt method in jQuery used to stop the rest of the event handlers from being executed for the selected element.
Syntax:
event.stopImmediatePropagation()
Parameter: No parameter is required.
Example 1: Here, only first pop box will appear after this method will stop the other pop box to appear.
HTML
<!DOCTYPE html> < html > < head > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" > </ script > < style > body { width: 70%; height: 40%; font-size: 30px; padding: 20px; border: 2px solid green; } div { display: block; background-color: lightgrey; padding: 4px; } </ style > < script > $(document).ready(function() { $("div").click(function(event) { alert("1st event executed"); event.stopImmediatePropagation(); }); $("div").click(function(event) { alert("2nd event executed"); }); $("div").click(function(event) { alert("3rd event executed"); }); }); </ script > </ head > < body > < div >Hello, Welcome to w3wiki.!</ div > </ body > </ html > |
Output:
Example 2: In this example, we will change the color of the single div by using this method.
HTML
<!DOCTYPE html> < html lang = "en" > < head > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" > </ script > < style > body { width: 70%; height: 40%; font-size: 30px; padding: 20px; border: 2px solid green; } p { display: block; padding: 4px; height: 30px; width: 150px; background-color: lightgrey; } div { display: block; padding: 4px; height: 30px; width: 400px; background-color: lightgrey; } </ style > </ head > < body > < p >Hello, </ p > < div >Welcome to w3wiki.!</ div > < script > $("p").click(function (event) { event.stopImmediatePropagation(); }); $("p").click(function (event) { // This function will not executed $(this).css("background-color", "yellow"); }); $("div").click(function (event) { // This function will executed $(this).css("background-color", "green"); }); </ script > </ body > </ html > |
Output:
Contact Us