कैसे IE में फोकस घटना को रोकने के लिए जब mousedown

Question

event.preventDefault(); return false; event.stopPropagation();

उनमें से किसी को होता है हो रहा है जब मैं फ़ायरफ़ॉक्स और क्रोम में एक mousedown घटना ट्रिगर से फोकस घटना को रोका जा सकता है, लेकिन यह IE.In वास्तव में विफल रहा है, क्रोम एक और है मुसीबत। जब mousedowning,: होवर सीएसएस काम नहीं कर रहा है। `

<input type="text" id="name"> 
<div id="suggest"> 
    <div>mark</div> 
    <div>sam</div> 
    <div>john</div> 
</div> 
$("#name").focus(suggest.show).blur(suggest.hide); 

` मेरी अपेक्षा जब मैं $ ("# नाम") इस तरह के "सैम" के रूप में उप div क्लिक करें, और फिर, है। वैल ("सैम")। लेकिन समस्या यह है कि, जब मैं माउस दबाता हूं (बस मूसडाउन, जारी नहीं किया जाता है), $ ("# name")। धुंध तुरंत चलता है और सुझाव देता है कि div छुपा हो जाता है।

Answer 1

उपयोग: इसके बजाय सक्रिय: माउस बटन नीचे होने पर लागू करने के लिए सीएसएस के लिए होवर करें।

मुझे नहीं लगता कि धुंधला घटना को रोकने से आप जो कुछ चाहते हैं वह करेंगे, क्योंकि यदि उपयोगकर्ता इनपुट पर क्लिक करता है, तो div पर, फिर पृष्ठ पर कहीं और, div रहता रहेगा। मैं कुछ अलग विकल्पों के बारे में सोच सकता हूं, प्रत्येक को अपने स्वयं के नुकसान के साथ। यह एक सही ढंग से व्यवहार करेंगे, जबकि उपयोगकर्ता पृष्ठ के भीतर रहता है, लेकिन उपयोगकर्ता पता पट्टी करने के लिए ले जाता है, तो div दिखाने छोड़ देंगे:

$("html").on("focus", "#name", function() { 
    $("#suggest").show(); 
}).mousedown(function() { 
    $("#suggest").hide(); 
}).on("mousedown", "#name, #suggest", function(e) { 
    e.stopPropagation(); 
});​ 

jsFiddle: http://jsfiddle.net/nbYnt/2/

आप समर्थन करने की आवश्यकता नहीं है, तो IE7, तो आप इस का उपयोग करते हुए सिर्फ सीएसएस कर सकते हैं (और यह वास्तव में किसी भी आधुनिक ब्राउज़र पर अपेक्षा के अनुरूप काम करता है, IE8 सहित):

#suggest { 
    display: none; 
} 

#name:focus + #suggest, #suggest:focus { 
    border: none; 
    display: block; 
} 

ध्यान दें कि आप div पर एक tabindex डाल करने के लिए सीएसएस विधि काम करने के लिए की जरूरत है :

<div id="suggest" tabindex="-1"> 

jsFiddle: http://jsfiddle.net/nbYnt/1/

अंत में, आप होने की ओर गलती कर सकते हैं div गायब (यह IE7 में काम करता है) सीएसएस के साथ जावास्क्रिप्ट के संयोजन के द्वारा:

#suggest:hover { 
    display: block !important; 
} 

$("#name").focus(function() { 
    $("#suggest").show(); 
}).blur(function() { 
    $("#suggest").hide(); 
}); 

समस्या इस विधि के साथ यह है कि div पर क्लिक करने के बाद, बस माउस को दूर ले जाने से div को गायब हो जाएगा।

jsFiddle: http://jsfiddle.net/nbYnt/4/

Answer 2

आप IE में रोकें खोने फोकस और अन्य के लिए mousedown हैंडलर के लिए "unselectable" विशेषता का उपयोग कर सकते हैं।

<input type="text" id="name"> 

<div onmousedown="return false" unselectable="on" id="suggest"> 
    <div unselectable="on">mark</div> 
    <div unselectable="on">sam</div> 
    <div unselectable="on">john</div> 
</div>