बाहर तत्व क्लिक करें पता?

Question

this question के समान, लेकिन इसे एक कदम आगे ले जाना। मैं आइटम का एक समूह है, जो मैं निम्नलिखित तरीके से निपटने कर रहा हूँ से बाहर क्लिक का पता लगाने के लिए करना चाहते हैं:

$('#menu div').live('click', function() { 
    // Close other open menu items, if any. 
    // Toggle the clicked menu item. 

    $('body').one('click', function(event) { 
     // Hide the menu item. 
     event.stopPropagation(); 
    }); 
}); 

यह एक आकर्षण की तरह काम करता है, दुर्भाग्य से, जब एक और मेनू आइटम खुला है और एक दूसरा क्लिक किया जाता है, दूसरे आइटम को खोलने के लिए दो क्लिक की आवश्यकता है। पहला क्लिक करें जो पहले मेनू आइटम को खोलता है, दूसरा दूसरा मेनू आइटम दिखाता है।

"सही" व्यवहार निम्नलिखित तरीके से काम करता है:

• क्लिक करने से एक मेनू आइटम यह खुलता है।
• उसी मेनू आइटम (या उसके बच्चों) पर क्लिक करना इसे बंद कर देता है।
• किसी अन्य मेनू आइटम पर क्लिक करने से पहले बंद हो जाता है, दूसरा खुलता है।
• (खुले) मेनू आइटम से दूर क्लिक करना उन्हें बंद कर देता है। ,

  // Captures click on menu items in spite of the not. 
  $('*').not('#menu *').one('click', function() { // Hide menu } 
  $('*:not(#menu)').one('click', function() { // Hide menu } 
  

  हमेशा की तरह किसी भी मदद के लिए धन्यवाद:

मैं ऊपर $('body').one() आदेश छोटी सफलता के साथ मेनू आइटम पर क्लिक करता है की अनदेखी करने के स्थान पर निम्नलिखित की कोशिश की है!

Answer 1

बस शरीर क्लिक हैंडलर के बाहर ले जाने और कुछ इस तरह करते हैं:

$('body').bind('click', function(e) { 
    if($(e.target).closest('#menu').length == 0) { 
     // click happened outside of menu, hide any visible menu items 
    } 
}); 

यह किया गया था गलत तरीके से टिप्पणी है कि e.target IE में काम नहीं करता है में बताया; यह सच नहीं है क्योंकि jQuery's Event object आवश्यकतानुसार इन असंगतताओं को ठीक करता है (आईई, सफारी)।

Answer 2

मैं एक लंबे समय पहले यह लिखा, jQuery की महिमा दिन पहले ...

function clickedOutsideElement(elemId) { 
    var theElem = getEventTarget(window.event); 
    while(theElem != null) { 
    if(theElem.id == elemId) 
     return false; 
    theElem = theElem.offsetParent; 
    } 
    return true; 
} 

function getEventTarget(evt) { 
    var targ = (evt.target) ? evt.target : evt.srcElement; 
    if(targ != null) { 
    if(targ.nodeType == 3) 
     targ = targ.parentNode; 
    } 
    return targ; 
} 

document.onclick = function() { 
    if(clickedOutsideElement('divTest')) 
    alert('Outside the element!'); 
    else 
    alert('Inside the element!'); 
}