छिपाने jQuery ui मेनू जब कहीं और

Question

हे लोग क्लिक किया उम्मीद थी तुम मुझे बाहर करने में मदद कर सकता है ... jQuery और जावास्क्रिप्ट के साथ एक नौसिखिया के

im कुछ हद तक। किसी ऑब्जेक्ट पर क्लिक होने पर दिखाई देने वाले jquery-ui मेनू को लागू करने का प्रयास किया जाता है, लेकिन जब मेनू पर मेनू के अलावा कहीं भी क्लिक किया जाता है तो गायब हो जाता है।

इस

कोड मैं अब तक

$("div.item").click(function(e){ 
     $("#menu").menu(); 
     $("#menu").css("top",e.pageY); 
     $("#menu").css("left",e.pageX); 

     }); 

अब मैं छिपाने के लिए और मेनू को नष्ट करता है, तो एक क्लिक के अग्रिम में कहीं भी मेनू itself..thanks पर के अलावा अन्य किया जाता है करना चाहते है।

Answer 1

आप धुंधला घटना का उपयोग करना चाहते हैं, जो किसी ऑब्जेक्ट पर ध्यान केंद्रित करते समय आग लगती है। किसी और चीज पर क्लिक करने से फोकस दूर हो जाएगा।

$("#menu").blur(function() { 
    // Your code here to either hide the menu (.toggle()) 
    // or remove it completely (.remove()). 
}); 

Answer 2

बस ऊपर कोड और टिप्पणी के लिए टैंक के लिए

(@ मृत्यु relic0, @ लेवी-Botelho)

// create 
$('#menu').blur(function() { 
    $('#menu').hide(); 
}); 

// show 
$('#menu').show().focus(); 

Answer 3

मैं JQuery यूआई selectmenu विजेट के साथ एक ही मुद्दा था और क्योंकि मैं यह समस्या उत्पन्न हुई JQuery UI selectmenu css फ़ाइल आयात नहीं किया था। मैंने ऐसा नहीं चुना क्योंकि मैं खुद को चुनिंदा मेनू बनाना चाहता था।

समस्या मैं अपने खुद के सीएसएस के लिए [aria-hidden="true"] { display: none; } जोड़ा ठीक करने के लिए, मैंने देखा है कि इस एरिया संपत्ति true और false के बीच टॉगल रहा था जब मैं इस मुद्दे को ठीक करने की कोशिश कर के आसपास खेल रहा है।

Answer 4

नमस्ते यह प्रक्रिया है जिसे हम ओक्लेस टेक्नोलॉजीज में jquery datepicker को छिपाने के लिए करते हैं।

हमारे मोडल की मूल संरचना इस तरह दिखेगी।

<button class="btn btn-info btn-lg" data-target="#myModal" data-toggle="modal" type="button">Open Modal</button> 

और यह हमारा मूल सीएसएस है और यह परिभाषित ऊंचाई मोडल के लिए है।

.modal-body { 
    min-height: 500px; 
    max-height: 500px; 
    overflow: auto; 
} 

$(".modal-body").scroll(function(){ 
    $("#ui-datepicker-div").hide(); 
}); 

आशा है कि यह मदद करता है