परिवर्तन कॉलबैक

Question

के अंदर किसी अन्य नियंत्रण पर ध्यान केंद्रित करते समय jQuery परिवर्तन घटना दो बार निकाल दी गई एक अजीब बग ने मुझे हाल ही में बहुत सारे सिरदर्द का कारण बना दिया, और मैं इसे संभवतः सरलतम रूप में कम करने में सक्षम हूं। इस बेला देखें: http://jsfiddle.net/PgAAb/

<input type="text" id="foo" placeholder="Change me!"><br> 
<input type="text" id="bar" size="30" placeholder="Dummy control to switch focus"> 

$('#foo').change(function() { 
    console.log('Changed!'); 
    $('#bar').focus(); 
}); 

मूल रूप से, जब आप पहली बार पाठ बॉक्स बदल सकते हैं और दस्तावेज़, परिवर्तन घटना आग में कहीं क्लिक करने के लिए, हमेशा की तरह माउस का उपयोग करें। हालांकि, यदि आप मान बदलते हैं, और परिवर्तन को ट्रिगर करने के लिए एंटर कुंजी दबाते हैं, तो ईवेंट दो बार आग लग जाता है।

मैंने देखा है कि बग केवल क्रोम के साथ है। फ़ायरफ़ॉक्स दो बार ईवेंट ट्रिगर नहीं करता है, और आईई इनपुट पर परिवर्तन ट्रिगर करने के लिए एंटर कुंजी का भी समर्थन नहीं करता है।

मुझे लगता है कि ईवेंट कॉलबैक के अंदर फ़ोकस स्विचिंग के कारण ऐसा होता है। क्या इसके आसपास कोई रास्ता है?

Answer 1

आपके परिवर्तन ईवेंटशेलर में अन्य नियंत्रण पर फोकस() क्रोम में परिवर्तन घटना को कॉल करता है क्योंकि यह मान अलग होने पर आपके वर्तमान नियंत्रण को "धुंधला" कर देता है।

इस बग नया नहीं है, आप jQuery पर इस बग टिकट पर एक नज़र ले जा सकते हैं: http://bugs.jquery.com/ticket/9335

आप परिवर्तन eventhandler को अक्षम करके इस के आसपास काम कर सकते हैं अपने नियंत्रण पर ध्यान केंद्रित करने को दूर करने से पहले। यहाँ मैं क्या कहना चाहते हैं का एक छोटा उदाहरण:

$('#foo').change(changeHandler); 

function changeHandler() { 
    console.log('Changed!'); 
    $(this).off('change').blur().on('change', changeHandler); 
    $('#bar').focus(); 
} 

Answer 2

इसके अलावा, आप इस बग वैकल्पिक हल कर सकते हैं के साथ सिर्फ अपने इनपुट को धुंधला पर कुंजी दर्ज करें:

jQuery('input').keydown(function(e){ 
    if(e.keyCode==13) jQuery(this).blur(); 
});