jQuery फायरिंग एक क्लिक के बिना घटना पर क्लिक करें

Question

ठीक है, ऐसा ही होता है।

$('.js-custom-dropdown').find('.custom-dropdown-unfolded').toggle(); 
$('.custom-dropdown-btn, .custom-dropdown-btn-unfolded').keydown(function(event){ 
    if (event.keyCode === 13) { 
     openDropdown($(this)); 
    } 
}).click(function(){ 
    openDropdown($(this)); 
}); 

function openDropdown (element){ 
    element.parents('.js-custom-dropdown').find('.custom-dropdown-unfolded').toggle(); 
    console.log($(this)) 
} 

जब मैं ड्रॉप-डाउन बटन पर क्लिक करें, openDropdown समारोह एक बार निष्पादित किया जाता है, लेकिन जब मैं टैब बटन और प्रेस के लिए अपने रास्ते में प्रवेश, समारोह दो बार कहा जाता है। मान लीजिए कि चेनिंग के साथ कुछ करना है, लेकिन मैं मानता हूं कि मैं इसके लिए नया हूं और jQuery डिज़ाइन पैटर्न को पूरी तरह से समझ नहीं पा रहा हूं। मैं keydown हैंडलर में फ़ंक्शन को दो बार कॉल कर सकता हूं और इससे समस्या हल हो जाएगी, लेकिन .. आप जानते हैं :)

क्या आप कृपया बता सकते हैं कि कोड के साथ क्या गलत है और इस तरह के व्यवहार का कारण क्या है?

Answer 1

यह एचटीएमएल 5 उपयोगकर्ता इंटरैक्शन विनिर्देशों के लिए नीचे है। यदि आप HTML spec for elements with a tabIndex पर एक नज़र डालेंगे तो आप पाएंगे कि किसी टैब तत्व के साथ किसी भी तत्व के लिए एंटर कुंजी एक क्लिक ईवेंट का कारण बनती है।

मुझे संदेह है कि इस व्यवहार का कारण क्या है। यह जांचने के लिए कि क्या यह मामला है, आप इसे पुराने (गैर-एचटीएमएल 5 अनुपालन) ब्राउज़र पर आज़मा सकते हैं।

संपादित करें (जैसा कि पोस्टर द्वारा अनुरोध किया गया है): answer given by @Terry आपके द्वारा जारी किए गए मुद्दे का समाधान करने का एक तरीका प्रदान करता है। ईवेंट पर jquery की "preventDefault" का उपयोग करके आप एंटर दबाते समय इसे दो बार हिट कर देंगे।

Answer 2

आप का उपयोग keydown पर क्लिक करें घटना को गति प्रदान कर सकते हैं: $(this).trigger('click');, और keydown पर डिफ़ॉल्ट कार्रवाई को रोकने: http://jsfiddle.net/yTuR3/