jQuery 'इनपुट' ईवेंट

206

मैंने jQuery में एक घटना के बारे में कभी नहीं सुना है inputजब तक कि मैंने इस jsfiddle को नहीं देखा ।

क्या आप जानते हैं कि यह क्यों काम कर रहा है? यह एक उपनाम है keyupया कुछ और के लिए?

$(document).on('input', 'input:text', function() {});

jquery events input

— silkfire
स्रोत

5

developer.mozilla.org/en-US/docs/Web/Reference/Events/input

— मूसा

12

changeकेवल एक बार आग को छोड़कर क्षेत्र का ध्यान केंद्रित किया है। inputतुरंत आग लग जाती है।

— jcsanyi

3

क्या आपने इसे खोजने की कोशिश की है?

— अपरिपक्व

2

@undefined हाँ मेरे पास है, अन्यथा मैं इसके लिए कोई सवाल नहीं करता। Google पर आने वाली एकमात्र चीज़ input तत्व के बारे में लेख हैं और इसमें घटनाओं को कैसे संलग्न किया जाए।

— रेशमकीट

3

यह सवाल सभी अवधारणाओं का खूबसूरती से जवाब देता है - stackoverflow.com/questions/15727324/…

— GemK

197

तब होता है जब उपयोगकर्ता इंटरफ़ेस के माध्यम से किसी तत्व की पाठ सामग्री को बदल दिया जाता है।

यह काफी उर्फ नहीं है keyupक्योंकि keyupअगर आग कुछ भी नहीं लगाती है, तो (उदाहरण के लिए: दबाने और फिर नियंत्रण कुंजी जारी करने से एक keyupघटना शुरू हो जाएगी )।

इसके बारे में सोचने का एक अच्छा तरीका इस तरह है: यह एक ऐसी घटना है जो जब भी इनपुट बदलती है, ट्रिगर हो जाती है। इसमें शामिल है - लेकिन सीमित नहीं है - दबाने वाली कुंजी जो इनपुट को संशोधित करती है (इसलिए, उदाहरण के लिए, Ctrlस्वयं घटना को ट्रिगर नहीं करेगी, लेकिन Ctrl-Vकुछ पाठ को चिपकाने के लिए), एक ऑटो-पूरा विकल्प, लिनक्स-स्टाइल मध्य का चयन करना -क्लिक पेस्ट, ड्रैग-एंड-ड्रॉप और बहुत सारी अन्य चीजें।

देखें इस पेज और अधिक जानकारी के लिए इस जवाब पर टिप्पणी।

— जे डेविड स्मिथ
स्रोत

11

क्या आपको पता है कि अगर jQuery लापता ब्राउज़र का समर्थन करता है? (IE8, IE9 विसंगतियाँ, आदि)

— jcsanyi

4

मैंने अभी-अभी 'js input event' जाना है। यह जानने के लिए कि आप Google पर क्या चाहते हैं, इसका उपयोग करने के लिए क्या शर्तें हैं; यह अनुभव के साथ आता है। और फिर, निश्चित रूप से, Google सब कुछ रिकॉर्ड करता है और इसका उपयोग यह जानने के लिए करता है कि आप वास्तव में क्या चाहते हैं। मेरी अधिकांश खोजें एपीआई डॉक्स और प्रोग्रामिंग प्रश्नों के लिए हैं, इसलिए यह समय के साथ सीखा है कि जब मैं चीजों की खोज करता हूं तो मुझे संभवतः एपीआई डॉक्स और प्रोग्रामिंग उत्तर दिखाना चाहिए।

— जे डेविड स्मिथ

3

खैर, मैं "jQuery इनपुट घटना" के लिए खोज रहा था, मुझे नहीं पता था कि यह एक मूल जेएस घटना थी। यहाँ भी, पहले परिणाम आम तौर पर एसओ से होते हैं, जिसे मैं ज्यादातर वास्तविक उत्तर / सूचना के आधिकारिक स्रोतों के रूप में मानता हूं।

— रेशमकीट

18

inputवास्तव में केवल एक फ़िल्टर्ड से अधिक है keyup, उदाहरण के लिए, यह तब भी आग लगाएगा जब मूल्य पहले इस्तेमाल किए गए मूल्यों की सूची से चुना गया था ... यह कुछ ऐसा था जिसे कोई inputघटना नहीं होने पर संभालना बहुत मुश्किल होगा ।

— szeryf

2

oninputमाउस द्वारा पाठ बदलने पर भी आग लग जाती है (या तो ड्रैग एंड ड्रॉप के माध्यम से, या राइट-क्लिक मेनू या पेस्ट करने के लिए मध्य-क्लिक के माध्यम से)।

— डेनिलसन सआ मिया

157

oninput ईवेंट इनपुट फ़ील्ड परिवर्तनों को ट्रैक करने के लिए बहुत उपयोगी है।

हालाँकि यह IE संस्करण <9 में समर्थित नहीं है। लेकिन पुराने IE संस्करणों की अपनी स्वामित्व घटना है onpropertychangeजो कि वैसी ही है oninput।

तो आप इसे इस तरह से उपयोग कर सकते हैं:

$(':input').on('input propertychange');

एक पूर्ण क्रॉसबोवर समर्थन करने के लिए।

चूंकि किसी भी संपत्ति परिवर्तन के लिए प्रॉपर्टीचेंज को ट्रिगर किया जा सकता है, उदाहरण के लिए, अक्षम संपत्ति को बदल दिया जाता है, तो आप यह करना चाहते हैं:

$(':input').on('propertychange input', function (e) {
    var valueChanged = false;

    if (e.type=='propertychange') {
        valueChanged = e.originalEvent.propertyName=='value';
    } else {
        valueChanged = true;
    }
    if (valueChanged) {
        /* Code goes here */
    }
});

— claustrofob
स्रोत

10

बिल्कुल वही जो मुझे चाहिए था। धन्यवाद। (मैं <IE9 का समर्थन करने से नफरत है।)

— DaleyKD

कुछ और जानकारी: "ओपेरा एक इनपुट क्षेत्र में पाठ छोड़ने के बाद एक इनपुट ईवेंट को फायर नहीं करता है। आईई 9 एक इनपुट ईवेंट को फायर नहीं करता है जब उपयोगकर्ता कीबोर्ड, कट, या ड्रैग ऑपरेशंस द्वारा भरे गए इनपुट से वर्ण हटाता है।" developer.mozilla.org/en-US/docs/Web/Events/…

— tkane2000

इस कोड के साथ एक समस्या है। यदि अधिकतम तरंग इनपुट तत्व पर सेट की जाती है, तो अधिकतम लंबाई तक पहुँचने पर भी 'इनपुट' ईवेंट चालू हो जाता है और मान परिवर्तित नहीं होता है

— nivcaner

लेकिन सिर्फ दो अलग-अलग कार्य क्यों नहीं? इस प्रकार, ईवेंट प्रकार या प्रॉपर्टी के नाम की जांच करने की कोई आवश्यकता नहीं है। कोड एक तीसरे साझा समारोह में हो सकता है।

— ADTC

17

JQuery का उपयोग करना, निम्नलिखित प्रभाव में समान हैं:

$('a').click(function(){ doSomething(); });
$('a').on('click', function(){ doSomething(); });

inputहालांकि, इस घटना के साथ , केवल दूसरे पैटर्न को उन ब्राउज़र में काम करना प्रतीत होता है जिन्हें मैंने परीक्षण किया है।

इस प्रकार, आप इस काम के लिए उम्मीद करेंगे, लेकिन यह कम से कम (वर्तमान में) नहीं है:

$(':text').input(function(){ doSomething(); });

फिर, यदि आप ईवेंट डेलिगेशन का लाभ उठाना चाहते हैं (उदाहरण के लिए #containerआपके input.textद्वारा DOM में जोड़े जाने से पहले ईवेंट सेट करना), तो यह ध्यान में आना चाहिए:

$('#container').on('input', ':text', function(){ doSomething(); });

अफसोस की बात है, फिर से, यह वर्तमान में काम नहीं करता है!

केवल यह पैटर्न काम करता है:

$(':text').on('input', function(){ doSomething(); });

अधिक जानकारी के साथ विस्तृत

मैं निश्चित रूप से पुष्टि कर सकता हूं कि यह पैटर्न:

$('#container').on('input', ':text', function(){ doSomething(); });

अब सभी 'मानक' ब्राउज़रों में भी काम करता है।

— इफडी ओकोंकवो
स्रोत

2

जैसा कि क्लॉस्ट्रोफ़ोब ने कहा, आईएन 9 आई + के लिए ओनीपुट का समर्थन किया जाता है।

हालाँकि , "इंटरनेट एक्सप्लोरर में oninput ईवेंट छोटी है। यह तब निकाल दिया जाता है जब वर्णों को उपयोगकर्ता इंटरफ़ेस के माध्यम से केवल टेक्स्ट फ़ील्ड से हटा दिया जाता है, जब अक्षर डाले जाते हैं। हालाँकि इंटरनेट एक्सप्लोरर 9 में ऑनप्रोपरेटचेंज घटना का समर्थन किया जाता है, लेकिन इसी तरह। oninput घटना, यह भी छोटी गाड़ी है, इसे हटाने पर फायर नहीं किया जाता है।

चूँकि वर्णों को कई तरीकों से हटाया जा सकता है (बैकस्पेस और डिलीट कीज़, CTRL + X, कट एंड डिलीट कमांड इन कॉन्टेक्स्ट मेनू), सभी परिवर्तनों का पता लगाने के लिए कोई अच्छा उपाय नहीं है। यदि संदर्भ मेनू के हटाए गए आदेश से वर्ण हटा दिए जाते हैं, तो इंटरनेट एक्सप्लोरर 9 में जावास्क्रिप्ट में संशोधन का पता नहीं लगाया जा सकता है। "

मेरे पास इनपुट और की-अप (और कीडाउन दोनों के लिए बाध्यकारी अच्छे परिणाम हैं, यदि आप चाहते हैं कि बैकस्पेस कुंजी को दबाए रखते हुए IE में आग लग जाए)।

— Zook
स्रोत

2

INPUT का उपयोग करते समय सावधान रहें। यह घटना IE 11 में फ़ोकस पर और ब्लर पर फायर करती है, लेकिन यह अन्य ब्राउज़रों में परिवर्तन पर चालू हो जाती है।

https://connect.microsoft.com/IE/feedback/details/810538/ie-11-fires-input-event-on-focus

— आनंद नफाड़े
स्रोत

1

मुझे लगता है कि 'इनपुट' यहाँ उसी तरह काम करता है जिस तरह से 'ऑनिनपूत' डोम लेवल ओ इवेंट मॉडल में होता है।

संयोग से:

जैसे ही सिल्कफायर ने यह टिप्पणी की, मैं भी 'jQuery इनपुट इवेंट' के लिए तैयार हो गया। इस प्रकार मैं यहां पहुंच गया और यह जानने के लिए चकित रह गया कि 'इनपुट' jquery के बाइंड () कमांड के लिए एक स्वीकार्य पैरामीटर है । कार्रवाई में jQuery में (पी। 102, 2008 संस्करण।) 'इनपुट' का उल्लेख एक संभावित घटना (20 अन्य लोगों के खिलाफ, 'ब्लर' से 'अनलोड') के रूप में नहीं किया गया है। यह सच है कि, पी। 92, इसके विपरीत (फिर से लेवल 0 और लेवल 2 के बीच विभिन्न स्ट्रिंग आइडेंटिफ़ायर के संदर्भ से) से फिर से जोड़ा जा सकता है। यह काफी भ्रामक है।

— ब्राइस Coustillas
स्रोत

इनपुट के लिए धन्यवाद (कोई इरादा नहीं), यह अब एक आधिकारिक धागा प्रतीत होता है! :)

— रेशमकीट

0

jQuery की .on()विधि के लिए निम्नलिखित हस्ताक्षर हैं :.on( events [, selector ] [, data ], handler )

घटनाएँ इस संदर्भ में सूचीबद्ध किसी की भी हो सकती हैं:

https://developer.mozilla.org/en-US/docs/Web/Events

हालांकि, वे सभी हर ब्राउज़र द्वारा समर्थित नहीं हैं।

मोज़िला इनपुट घटना के बारे में निम्नलिखित बताता है:

DOM इनपुट ईवेंट को किसी तत्व या मान के बदले जाने पर समकालिक रूप से निकाल दिया जाता है। इसके अतिरिक्त, यह सामग्री के संपादकों पर आग लगाता है जब इसकी सामग्री बदल जाती है।

— रॉबर्ट रोचा
स्रोत

-8

$("input#myId").bind('keyup', function (e) {    
    // Do Stuff
});

IE और क्रोम दोनों में काम करना

— राज
स्रोत

bindपदावनत किया जाता है, का उपयोग करेंon

— तुषार