JQuery में इनपुट [टाइप = टेक्स्ट] के मूल्य परिवर्तन का पता लगाना

Question

मैं हर बार किसी विशिष्ट इनपुट बॉक्स में परिवर्तन के मूल्य पर एक कार्य निष्पादित करना चाहता हूं। यह लगभग काम करता है $('input').keyup(function), लेकिन उदाहरण के लिए, बॉक्स में टेक्स्ट चिपकाते समय कुछ नहीं होता है। $input.change(function)जब इनपुट धुंधला हो जाता है तो केवल ट्रिगर होता है, इसलिए जब भी किसी टेक्स्ट बॉक्स का मूल्य बदल जाता है, तो मुझे तुरंत कैसे पता चलेगा?

Comments

तो दोनों keyupऔर pasteघटनाओं पर कोई प्रतिबंध क्यों नहीं ?

— इलिया जी

devcurry.com/2009/07/… - कट / कॉपी / पेस्ट इवेंट्स का पता लगाना

— BeRecursive

@ liho1eye pasteसिर्फ एक ही चीज है जिसके बारे में मैंने सोचा था, मैं एक निश्चित बदलाव के लिए सुनना चाहता हूं, जो कि सभी अलग-अलग आवक के बारे में सोचना है।

— जेरिको

@Jeriko यही दो तरीके हैं जिन्हें बदला जा सकता है (जेएस कोड के माध्यम से स्पष्ट अद्यतन के बगल में)।

— इलिया जी

आप Ctlr-X ( cut) पर भी कब्जा करना चाहते हैं ।

— एलेक्सिस विलके

Answer 1

बस याद दिलाता हूं कि 'ऑन' 'बाइंड' फंक्शन पर फिर से बनाया गया है, इसलिए हमेशा एक इवेंट श्रोता का उपयोग करने की कोशिश करें जैसे:

$("#myTextBox").on("change paste keyup", function() {
   alert($(this).val()); 
});

Comments

pasteहालांकि क्यों ? पहले मैंने सोचा कि यह केवल तभी काम करता है जब हम कुछ के साथ पेस्ट करते हैं CTRL+V।

— ब्लैक

@ NicolasS.Xu: मूल्यों का प्रत्यक्ष संरेखण किसी भी डोम घटना को ट्रिगर नहीं करता है

— एलेजांद्रो सिल्वा

के console.log()बजाय का उपयोग कर बेहतर होगा alert। कीप के लिए बहुत कष्टप्रद होगा alert।

— सायट्सनी

@cytsunny हाँ यकीन है, चेतावनी कष्टप्रद है, लेकिन इस मामले में मूल्य परिवर्तन पर निष्पादित होने वाले कोड का एक उदाहरण है, यह वास्तव में आप चाहते हैं कोई भी पेलोड हो सकता है।

— अलेजांद्रो सिल्वा

यदि आप राइट क्लिक और पेस्ट करते हैं, तो यह पेस्ट से पहले इनपुट के मूल्य को लौटा देगा।

— alstr

Answer 2

विवरण

आप jQuery की .bind()विधि का उपयोग करके ऐसा कर सकते हैं । JsFiddle बाहर की जाँच करें ।

नमूना

एचटीएमएल

<input id="myTextBox" type="text"/>

jQuery

$("#myTextBox").bind("change paste keyup", function() {
   alert($(this).val()); 
});

अधिक जानकारी

• jsFiddle प्रदर्शन
• jQuery.bind ()

Answer 3

इसके लिए प्रयास करें .. क्रेडिट https://stackoverflow.com/users/1169519/teemu पर

यहाँ मेरे सवाल का जवाब देने के लिए: /programming/24651811/jquery-keyup-doesnt-work-with-keycode-filtering?noredirect=1#comment38213480_24651811

इस समाधान से मुझे अपने प्रोजेक्ट पर आगे बढ़ने में मदद मिली।

$("#your_textbox").on("input propertychange",function(){

   // Do your thing here.
});

नोट: IE के निम्न संस्करणों के लिए प्रॉपर्टीचेंज।

Answer 4

आप टेक्स्टबॉक्स घटनाओं का भी उपयोग कर सकते हैं -

<input id="txt1" type="text" onchange="SetDefault($(this).val());" onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();">

function SetDefault(Text){
  alert(Text);
}

इसे इस्तेमाल करे

Answer 5

इसे इस्तेमाल करे:

मूल रूप से, प्रत्येक घटना के लिए बस खाता है:

एचटीएमएल:

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

jQuery:

$("#textbox").keyup(function() { 
    alert($(this).val());  
}); 

$("#textbox").change(function() { 
alert($(this).val());  
}); 

Answer 6

$("#myTextBox").on("change paste keyup select", function() {
     alert($(this).val());
});

ब्राउज़र सुझाव के लिए चयन करें

Answer 7

इसे इस्तेमाल करे:

$("input").bind({
            paste : function(){
                $('#eventresult').text('paste behaviour detected!');
            }
})

Answer 8

इसका उपयोग करें: https://github.com/gilamran/JQuery-Plugin-AnyChange

यह सामग्री मेनू (माउस का उपयोग करके) सहित इनपुट को बदलने के सभी तरीकों को संभालता है

Comments

आप इसका इस्तेमाल कैसे करते हैं? मैं इसे अपने HTML में शामिल करता हूं और $ ("इनपुट") का उपयोग करता हूं। anyChange (फ़ंक्शन (ई) {कंसोल.लॉग (ई);}); लेकिन इसे कभी भी कंसोल.लॉग लाइन

— Ofer Gal

Answer 9

घटनाओं के इस संयोजन ने मेरे लिए काम किया:

$("#myTextBox").on("input paste", function() {
   alert($(this).val()); 
});

Answer 10

भूल जाओ cutया नहींselect !

स्वीकृत उत्तर लगभग सही है, लेकिन यह cutऔर के बारे में भूल जाता हैselect घटनाओं घटनाओं के ।

cut जब उपयोगकर्ता पाठ काटता है (CTRL + X या दाईं ओर क्लिक करके) निकाल दिया जाता है

select जब उपयोगकर्ता ब्राउज़र-सुझाए गए विकल्प का चयन करता है तो उसे निकाल दिया जाता है

आपको उन्हें भी जोड़ना चाहिए, जैसे:

$("#myTextBox").on("change paste keyup cut select", function() {
   //Do your function 
});