JQuery में लाइव () को चालू करना ()


202

मेरे आवेदन में गतिशील रूप से ड्रॉपडाउन जोड़ा गया है। उपयोगकर्ता को जितने की आवश्यकता हो उतने जोड़ सकते हैं।

मैं परंपरागत रूप से jQuery की live()विधि का उपयोग करके पता लगा रहा था कि इनमें से एक ड्रॉपडाउन कब था change():

$('select[name^="income_type_"]').live('change', function() {
    alert($(this).val());
});

1.7 jQuery के रूप में, मैं इसे करने के लिए अद्यतन किया है:

$('select[name^="income_type_"]').on('change', function() {
    alert($(this).val());
});

डॉक्स को देखते हुए, यह पूरी तरह से वैध होना चाहिए (दाएं?) - लेकिन ईवेंट हैंडलर कभी भी फायर नहीं करता है। बेशक, मैंने पुष्टि की है कि jQuery 1.7 लोड और चल रहा है, आदि। त्रुटि लॉग में कोई त्रुटि नहीं है।

मैं क्या गलत कर रहा हूं? धन्यवाद!


2
मुझे पता है कि यह देर हो चुकी है, लेकिन ऐसा लगता है कि jQuery liveवास्तव में onवैसे भी उपयोग कर रहा है, इसलिए विरासत कोड की फिर से लिखने की अभी तक आवश्यकता नहीं हो liveसकती है, जब तक कि मुझे नहीं लगता कि 1.9 है। 1.7.1 स्रोत से अंश: live: function( types, data, fn ) {jQuery( this.context ).on( types, this.selector, data, fn ); return this;}इसलिए यदि कोई ऐसे संस्करण में अपग्रेड नहीं हो रहा है जिसमें liveअपडेट हो गया है तो लेगेसी कोड के लिए तुरंत आवश्यकता नहीं हो सकती है। के लिए नए पाठ्यक्रम का उपयोग कर बंद कोड on()के बजाय के रूप में सिफारिश की है। मुझे लगा कि यह जानकारी किसी और को किसी चरण में मदद कर सकती है।
नोप

1
परिवर्तन करने के तरीके पर माइग्रेशन उदाहरण देखें । liveon
शमूएल ल्यू

जवाबों:


246

onप्रलेखन राज्यों (बोल्ड में;)):

ईवेंट हैंडलर केवल वर्तमान में चयनित तत्वों के लिए बाध्य हैं; जिस समय आपका कोड कॉल करता है, उस समय उन्हें पृष्ठ पर मौजूद होना चाहिए .on()

समतुल्य .live()होना कुछ इस तरह होगा

$(document.body).on('change', 'select[name^="income_type_"]', function() {
    alert($(this).val());
});

यद्यपि यह बेहतर है कि आप ईवेंट हैंडलर को यथासंभव तत्वों से बाँधें, यानी पदानुक्रम में किसी तत्व के अधिक निकट होना।

अद्यतन: एक और सवाल का जवाब देते हुए, मुझे पता चला कि यह .liveप्रलेखन में भी वर्णित है :

.live()अपने उत्तराधिकारियों के संदर्भ में विधि को फिर से लिखना सीधा है; ये तीनों ईवेंट अटैचमेंट विधियों के लिए समान कॉल के लिए टेम्प्लेट हैं:

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+

5
@ जैक: कोई चिंता नहीं, IMO यह एक अच्छा सवाल है। मुझे लगता है कि अन्य लोग इस पर भी ठोकर खाएंगे, जब वे सभी को बदलने की कोशिश करेंगे bind, liveऔर delegateकॉल करेंगे on
फेलिक्स क्लिंग

4
आह हां, और निश्चित रूप से हम केवल एक कंबल खोजने और बदलने के बाद इस जवाब को देखते हैं .live>.on
ajbeaven

3
IMO, .onवाक्यविन्यास अधिक तार्किक है, क्योंकि श्रोता वास्तव में उस चयनकर्ता से जुड़ा होता है जिसे आप प्रदान करते हैं। जब ईवेंट चालू हो जाता है, तो jQuery DOM को ट्रेस करता है और हैंडलर निष्पादित करता है जहां निर्दिष्ट (सरल ईवेंट डेलिगेशन)। .liveसुझाव दिया कि कुछ "जादुई" हुआ, और यह कहा गया कि "भविष्य के तत्वों" के लिए घटना संचालकों को संलग्न करना जो पूरी तरह से सच नहीं था।
डेविड हेलसिंग

1
@FelixKling जो सही है - मैं इस पर भी ठोकर खाई! धन्यवाद
willdanceforfun

2
खोज इंजन के लिए: jQuery ".live ()" विधि v1.7 के बाद से मूल्यह्रास और v1.9 में हटा दी गई है। इसके बजाय ".on ()" विधि का उपयोग करके अपनी स्क्रिप्ट ठीक करें। हैरानी की बात यह है कि यह वर्तमान Microsoft jquery.unobtrusive-ajax.js v2.0.20710.0 को प्रभावित करता है (Microsoft ने अपनी स्क्रिप्ट को अपडेट नहीं किया इसलिए अब यह टूट गया है)।
टोनी वॉल

25

चयनित उत्तर के अलावा,

jQuery.liveजब आप अपने एप्लिकेशन के माइग्रेट होने का इंतजार करते हैं तो jQuery 1.9+ पर पोर्ट करें। इसे अपनी जावास्क्रिप्ट फ़ाइल में जोड़ें।

// Borrowed from jQuery 1.8.3's source code
jQuery.fn.extend({
  live: function( types, data, fn ) {
          if( window.console && console.warn ) {
           console.warn( "jQuery.live is deprecated. Use jQuery.on instead." );
          }

          jQuery( this.context ).on( types, this.selector, data, fn );
          return this;
        }
});

नोट: उपरोक्त फ़ंक्शन jQuery v3 से काम नहीं करेगा जैसा this.selectorकि हटा दिया गया है।

या, आप https://github.com/jquery/jquery-migrate का उपयोग कर सकते हैं


7

बस एक बेहतर समाधान मिला, जिसमें थर्ड पार्टी कोड का संपादन शामिल नहीं है:

https://github.com/jquery/jquery-migrate/#readme

सभी संस्करण समस्याओं को दूर करने के लिए Visual Studio में jQuery माइग्रेट NuGet पैकेज स्थापित करें। अगली बार जब Microsoft अपने विनीत AJAX और सत्यापन मॉड्यूल को अपडेट करता है, तो शायद यह माइग्रेट स्क्रिप्ट के बिना यह देखने की कोशिश करता है कि क्या उन्होंने इस मुद्दे को हल किया है।

जैसा कि jQuery के माइग्रेशन को jQuery फाउंडेशन द्वारा बनाए रखा गया है, मुझे लगता है कि यह न केवल तीसरे पक्ष के पुस्तकालयों के लिए सबसे अच्छा दृष्टिकोण है और यह भी कि कैसे अपडेट करने के लिए अपने स्वयं के पुस्तकालयों के लिए चेतावनी संदेश प्राप्त करें।


3

चयनित उत्तरों के अलावा,

यदि आप Visual Studio का उपयोग करते हैं, तो आप Regex Replace का उपयोग कर सकते हैं ।
संपादित करें> फ़ाइलों में बदलें और बदलें> बदलें
या Ctrl + Shift + H

पॉप-अप ढूंढें और बदलें, इन फ़ील्ड्स को सेट करें

क्या खोजें \$\((.*)\)\.live\((.*),
: $(document.body).on($2,$1,
इसके साथ बदलें: विकल्प खोजें चेक में "रेगुलर एक्सप्रेशंस का उपयोग करें"


हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.