jQuery: कीडाउन हैंडलर में नया मान प्राप्त करना

Question

मैं इस प्रश्न पर आया: onKeyPress Vs. onKeyUp and onKeyDown, जहां से मैंने पाया कि keypress किसी भी चरित्र को पाठ इनपुट में टाइप किए जाने पर आग लगाना चाहिए। मैं इस कोड को चलाने की कोशिश कर रहा हूं। यह इनपुट की पृष्ठभूमि पीले रंग के पल को पीले जाने के पल में माना जाता है जब उसकी टेक्स्ट लम्बाई 0 से अधिक हो जाती है, या उस समय सफेद हो जाता है। मैं इसे काम नहीं कर सकता। अगर मैं keydown करने की कोशिश, मैं निम्नलिखित समस्या है:

1. मैं सिर्फ एक वर्ण टाइप करें और चलते हैं, तो पृष्ठभूमि सफेद बनी हुई है।

2. यदि मैं backspace दबाता हूं, इस प्रकार मैं एक चरित्र को साफ़ करता हूं, यह पीला हो जाता है (केवल वही है जो मैं चाहता हूं!)। अगर मैं अब कोई अन्य कुंजी दबाता हूं (Alt, Shift) यह फिर से सफेद हो जाएगा। वास्तव में, यदि Alt या Shift के बजाय मैं एक वर्ण टाइप करता हूं, तो यह अभी भी सफेद रहेगा, हमें पहली समस्या पर वापस ले जाएगा।

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

अगर मैं कोशिश keyup केवल, इन समस्याओं कर रहे हैं (उम्मीद के रूप में):

1. पृष्ठभूमि के रूप में लंबे समय के रूप कुंजी दबाया रखा जाता है नहीं बदलता है, तब भी जब एक चरित्र में जोड़ा जाता है खाली इनपुट या पूरा पाठ हटा दिया गया।

अगर मैं keypress कोशिश, मैं keydown रूप में एक ही समस्याओं का सामना है, भले ही यह काम करने के लिए माना जाता है।

अगर मैं keyup, keydown और keypress (! भगवान मैं बेताब हूँ) के लिए 3 संचालकों बाँध, लगभग सभी समस्याओं keydown के 3 समस्या को छोड़कर हल कर रहे हैं: अगर मैं प्रेस एक चरित्र कुंजी लिखें और इसे दबाया रखने के लिए, पृष्ठभूमि सफेद बनी हुई है पहले चरित्र के लिए, और पीले दूसरे चरित्र के बाद बदल जाता है।

मैं इस समस्या को कैसे हल करूं?

जे एस:

$(document).ready(function() { 

    $("input").bind("keydown", function() { 
     if ($(this).val().length == 0) { 
      $(this).css('background', 'white'); 
     } else { 
      $(this).css('background', 'yellow'); 
     } 
    }); 

    $("input").bind("keypress", function() { 
     if ($(this).val().length == 0) { 
      $(this).css('background', 'white'); 
     } else { 
      $(this).css('background', 'yellow'); 
     } 
    }); 

    $("input").bind("keyup", function() { 
     if ($(this).val().length == 0) { 
      $(this).css('background', 'white'); 
     } else { 
      $(this).css('background', 'yellow'); 
     } 
    }); 

}); 

HTML:

<input type='text' /> 

Answer 1

जब keydown घटना निकाल दिया जाता है, चरित्र अभी तक इनपुट बॉक्स में लिखा नहीं है।

मैंने कुछ शोध किया और आपको इच्छित व्यवहार प्राप्त करने के लिए timeout का उपयोग करने की अनुशंसा की जाती है। जाहिर है, छोटे विलंब के दौरान, इनपुट पर change ईवेंट निकाल दिया गया है, और .val() फिर नई सामग्री देता है। एक jsFiddle