बच्चे को माता-पिता को प्रभावित करने से कैसे रोकें

Question

CHILD तत्व को PARENT तत्व को प्रभावित करने से कैसे रोकें?

jQuery:

$("#parent").click(function() { 
    alert('parent clicked'); 
}); 
$("#child").click(function() { 
    alert('child clicked'); 
}); 

HTML:

<div id="parent"> 
    click me - parent 
    <div id="child">click me - child</div> 
</div> 

आप बच्चे को क्लिक करते हैं, माता-पिता भी सक्रिय है और हम 2 सचेतक हैं।

तो मैं बच्चे को माता-पिता को प्रभावित करने से कैसे रोक सकता हूं?

Answer 1

event.stopPropagation()

$("#child").click(function(event) { 

    event.stopPropagation(); 

    alert('child clicked'); 
}); 

कॉलिंग event.stopPropagation() डोम पेड़ खलबली मचाने वाले से घटना बंद हो जाएगा।

Answer 2

इसे event bubbling या event propagation कहा जाता है। इसे आपके कोड में e.stopPropagation() जोड़कर रोका जा सकता है। यदि आप डिफ़ॉल्ट व्यवहार को भी रोकना चाहते हैं तो आप बस कर सकते हैं: return false;।

return false; मूल रूप से दोनों: e.stopPropagation() और e.preventDefault() दोनों करता है। यदि आप उदाहरण के लिए <a> टैग का उपयोग कर रहे हैं तो आप उपयोगी हो सकते हैं और आप क्लिक के बाद पृष्ठ को नेविगेट करना बंद करना चाहते हैं।