jquery: event.stopImmediatePropagation() बनाम झूठी झूठी

Question

क्या इवेंट हैंडलर के अंदर event.stopImmediatePropagation() और return false को कॉल करने के बीच कोई अंतर है?

Answer 1

हां वे अलग हैं।

return false मूल रूप से event.stopPropagation() और event.preventDefault() दोनों को कॉल करने जैसा ही है।

event.stopImmediatePropagation() जबकि के रूप में event.stopPropagation()प्लस एक ही तत्व पर अन्य पंजीकृत ईवेंट हैंडलर्स को रोकने निष्पादित करने के लिए एक ही है। इसलिए यह किसी ईवेंट के लिए डिफ़ॉल्ट कार्रवाई को रोकता नहीं है, जैसे क्लिक किए गए लिंक का पालन करना।

संक्षेप में:

      stop | prevent  | prevent "same element" 
          bubbling | default action | event handlers 

return false     Yes   Yes    No 
preventDefault    No   Yes    No 
stopPropagation    Yes   No    No 
stopImmediatePropagation  Yes   No    Yes 

return false भी "सामान्य" में काम करता है जावास्क्रिप्ट ईवेंट हैंडलर्स

event.stopPropagation() और event.preventDefault() भी "सामान्य" जावास्क्रिप्ट ईवेंट हैंडलर्स में काम करते हैं (एक W3C संगत ब्राउज़र में), जबकि event.stopImmediatePropagation() jQuery से एक विस्तार है (अद्यतन: स्पष्ट रूप से यह DOM Level 3 Events specification का हिस्सा है)।

नोट:return false "सामान्य" (गैर jQuery) ईवेंट हैंडलर्स (this answer देखें) (लेकिन अभी भी डिफ़ॉल्ट कार्रवाई रोकता है) में खलबली मचाने वाले से घटना नहीं रोकता है।

---

शायद लायक पढ़ने:

• jQuery Events: Stop (Mis)Using Return False
• quirksmode.org - Event order

Answer 2

हां। event.stopImmediatePropagation() उस घटना के लिए किसी अन्य हैंडलर को नहीं जाने देगा, भले ही वे कहां बंधे हों। वापसी झूठी केवल अन्य तत्वों से बंधे हैंडलर को रोकती है (यानी इवेंट हैंडलर स्टॉपइमीडिएटप्रॉपेशन() कॉल से निपटने वाले इवेंट हैंडलर के रूप में नहीं) ईवेंट प्राप्त करने से।

Answer 3

रिटर्निंग false घटना बुलबुले को रोक देगा, लेकिन अन्य बाध्य घटनाएं आग लग जाएंगी। हालांकि stopImmediatePropagation अन्य बाध्य घटनाओं को गोलीबारी से रोकता है और बुलबुले रोकता है।

इस पर jsfiddle पर कोड का उदाहरण।

Answer 4

@FelixKling जवाब की मेज होने महान अवधारणा:

मैं और अधिक पोस्टिंग कर रहा हूँ के बारे में बताया तालिका:

      stop | prevent  |  prevent   | 
          bubbling | default action | event handlers  | 
                Same Element | Parent Element 

return false     Yes   Yes    No   No 
preventDefault    No   Yes    No   No 
stopPropagation    Yes   No    No   Yes 
stopImmediatePropagation  Yes   No    Yes   No 

संदर्भ: https://stackoverflow.com/a/5302939/2236219

Answer 5

यहाँ return false के लिए पूर्ण डेमो है, preventDefault, stopPropagation और stopImmediatePropagation:

var kid = document.getElementsByTagName('button')[0]; 
 
var dad = document.getElementsByTagName('div')[0]; 
 

 
kid.addEventListener('click', function(e) { 
 
    console.log('kid here'); 
 
    e.stopImmediatePropagation(); 
 
}); 
 

 
kid.addEventListener('click', function(e) { 
 
    console.log('neighbour kid here'); 
 
}); 
 

 
dad.addEventListener('click', function(e) { 
 
    console.log('dad here'); 
 
}); 
 

 
dad.addEventListener('click', function(e) { 
 
    console.log('neighbour dad here'); 
 
});

<div> 
 
    <button>press</button> 
 
</div>

(इसके अलावा पर JSFiddle उपलब्ध।)

manwal’s answer में तालिका पूरी तरह से सही नहीं है।

      stop | prevent  |  prevent 
          bubbling | default action | event handlers 
            |    | Same Element | Parent Element 

return false     Yes   Yes    No   No 
preventDefault    No   Yes    No   No 
stopPropagation    Yes   No    No   Yes 
stopImmediatePropagation  Yes   No    Yes   **Yes**