दिलचस्प पोस्ट
जावा के साथ फैंसी समीकरण दिखा रहा है क्यों नहीं सामान्य अपवाद पकड़ एएसपी.नेट एमवीसी में ऑथराइज एट्रिब्यूट ओवरराइड करें पायथन में स्पष्ट 'स्व' कैसे बचें? मैं जावास्क्रिप्ट में एक दो आयामी सरणी कैसे बना सकता हूं? उच्च आयामी डेटा में निकटतम पड़ोसियों? वसंत व्यवहार सिमुलेशन मैं जेएसपी में विशेष एचटीएमएल वर्णों से कैसे बचा सकता हूं? कैसे JSF में नेविगेट करने के लिए? यूआरएल कैसे करें वर्तमान पेज को प्रतिबिंबित करें (और पिछला नहीं) अनाम पुनरावर्ती PHP फ़ंक्शन क्या यह एक HTML टूलटिप (शीर्षक विशेषता) को प्रारूपित करना संभव है? मैं एक गीथहब पुल अनुरोध कैसे देख सकता हूं? कैमरा एसडीके के साथ कैमरे तक पहुंचें क्या आईफोन एसडीके वाई-फाई एसएसआईडी को वर्तमान में कनेक्ट कर सकता है? PHP में बहु-आयामी सरणी से डुप्लिकेट मान कैसे निकालें

jQuery .live () बनाम .on () गतिशील HTML को लोड करने के बाद क्लिक ईवेंट को जोड़ने के लिए विधि

मैं jQuery v.1.7.1 का उपयोग कर रहा हूं जहां .live () विधि को जाहिरा तौर पर पदावनत किया गया है।

मुझे जो समस्या है वह यह है कि जब गतिशील रूप से एचटीएमएल को किसी तत्व में लोड हो रहा है:

$('#parent').load("http://..."); 

अगर मैं कोशिश करता हूं और बाद में एक क्लिक ईवेंट जोड़ता हूं तो यह इन तरीकों में से किसी का उपयोग करके ईवेंट को पंजीकृत नहीं करता है:

 $('#parent').click(function() ...); 

या

 // according to documentation this should be used instead of .live() $('#child').on('click', function() ...); 

इस कार्यक्षमता को प्राप्त करने का सही तरीका क्या है? यह केवल मेरे लिए। () के साथ काम करने लगता है, लेकिन मुझे उस विधि का उपयोग नहीं करना चाहिए ध्यान दें कि # चाइल्ड एक गतिशील लोडेड तत्व है।

धन्यवाद।

वेब के समाधान से एकत्रित समाधान "jQuery .live () बनाम .on () गतिशील HTML को लोड करने के बाद क्लिक ईवेंट को जोड़ने के लिए विधि"

यदि आप गतिशील रूप से लोड किए गए तत्व के लिए काम करने के लिए क्लिक हैंडलर चाहते हैं, तो आप पेरेंट ऑब्जेक्ट पर ईवेंट हैंडलर सेट करते हैं (जो कि गतिशील रूप से लोड नहीं होता है) और इसे एक ऐसा चयनकर्ता दे जो आपके डायनामिक ऑब्जेक्ट से मेल खाता है:

 $('#parent').on("click", "#child", function() {}); 

ईवेंट हैंडलर को #parent ऑब्जेक्ट से जोड़ा जाएगा और कभी भी #child पर उत्पन्न होने #child एक क्लिक इवेंट बुलबुले, यह आपके क्लिक हैंडलर को आग लगा देगा इसे प्रत्यायोजित इवेंट हैंडलिंग कहा जाता है (ईवेंट हैंडलिंग को पैरेंट ऑब्जेक्ट के लिए डिलीवर किया गया है)

यह इस तरह से किया गया है क्योंकि आप ईवेंट को #parent ऑब्जेक्ट के साथ संलग्न कर सकते हैं, जब भी #parent ऑब्जेक्ट अभी भी अस्तित्व में नहीं है, लेकिन जब यह बाद में मौजूद है और क्लिक किया जाता है, तो क्लिक इवेंट #parent ऑब्जेक्ट तक #parent देखें कि यह #child पर उत्पन्न हुआ है और #child पर एक क्लिक के लिए एक ईवेंट हैंडलर है और आपका ईवेंट आग लगा है

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

 $('#parent').on('click', '#child', function() { // Code }); 

$.on() प्रलेखन:

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

जब आप $.on() कॉल करते हैं, तो आपके #child तत्व मौजूद नहीं है, इसलिए ईवेंट बाध्य नहीं है ( $.live() विपरीत)। #parent , हालांकि, मौजूद है, इसलिए उस घटना को ठीक करना ठीक है

ऊपर दिए गए मेरे कोड का दूसरा तर्क केवल 'ट्रिगर' के रूप में कार्य करता है, यदि यह घटना #parent लिए #parent से #child

$(document).on('click', '#selector', function() { /* do stuff */ });

संपादित करें: मैं यह कैसे काम करता है पर थोड़ा और जानकारी प्रदान कर रहा हूँ, क्योंकि … शब्द इस उदाहरण के साथ, आप पूरे दस्तावेज़ पर एक श्रोता रख रहे हैं

जब आप किसी भी तत्व ( #selector ) मिलान से #selector पर click करते हैं, तो घटना मुख्य दस्तावेज़ तक बुलबुले – जब तक कोई अन्य श्रोताओं के पास कॉल नहीं होता है event.stopPropagation() विधि – जो कि माता-पिता के लिए एक ईवेंट के बुदबुदाती शीर्ष पर होता है तत्वों।

एक विशिष्ट तत्व या तत्वों के सेट के लिए बाइंडिंग के बजाय, आप निर्दिष्ट चयनकर्ता से मेल खाने वाले तत्वों से आने वाले किसी भी ईवेंट को सुन रहे हैं। इसका मतलब है कि आप एक श्रोता बना सकते हैं, एक बार, जो वर्तमान में मौजूदा तत्वों के साथ-साथ किसी भी गतिशील रूप से जोड़े गए तत्वों को स्वचालित रूप से मैच करेगा।

यह कुछ कारणों के लिए चतुर है, जिसमें प्रदर्शन और स्मृति उपयोग (बड़े पैमाने पर अनुप्रयोगों में) शामिल हैं

.live () के बराबर 1.7 इस तरह दिखता है:

 $(document).on('click', '#child', function() ...); 

असल में, क्लिक ईवेंट के लिए दस्तावेज़ देखें और उन्हें #child के लिए फ़िल्टर करें

मुझे पता है कि उत्तर के लिए थोड़ी देर हो चुकी है, लेकिन मैंने .live () विधि के लिए एक polyfill बनाया है। मैंने इसे jQuery 1.11 में परीक्षण किया है, और यह बहुत अच्छी तरह से काम करता है। मुझे पता है कि हमें संभवतः .on () पद्धति को लागू करना चाहिए, जहां भी संभव हो, लेकिन बड़ी परियोजनाओं में, जहां सभी .live () कॉलों को परिवर्तित करना संभव नहीं है। Com () कॉल किसी भी कारण से, निम्नलिखित कारण हो सकता है काम:

 if(jQuery && !jQuery.fn.live) { jQuery.fn.live = function(evt, func) { $('body').on(evt, this.selector, func); } } 

बस में शामिल होने के बाद आप jQuery लोड करें और इससे पहले कि आप लाइव कॉल करें ()।

.on () jQuery के संस्करण 1.7 और इसके बाद के संस्करण के लिए है। यदि आपके पास पुराने संस्करण है, तो इसका उपयोग करें:

 $("#SomeId").live("click",function(){ //do stuff; }); 

मैंने अपनी परियोजना में 'लाइव' का इस्तेमाल किया लेकिन मेरे एक दोस्त ने सुझाव दिया कि मुझे लाइव के बजाय 'ऑन' का उपयोग करना चाहिए। और जब मैंने इसे इस्तेमाल करने की कोशिश की तो मैंने आपको एक समस्या का अनुभव किया था जैसे आपके पास था।

मेरे पृष्ठों पर मैं टेबल टेबल पंक्तियों और कई डोमेन सामान गतिशील बना देता हूं। लेकिन जब मैं जादू पर इस्तेमाल गायब हो गया।

दूसरे समाधान जैसे कि एक बच्चे की तरह इस्तेमाल करते हैं, हर क्लिक पर हर बार आपके कार्यों को कॉल करते हैं। लेकिन मुझे इसे फिर से बनाने का एक तरीका मिल गया है और यहां समाधान है।

अपना कोड इस रूप में लिखें:

 function caller(){ $('.ObjectYouWntToCall').on("click", function() {...magic...}); } 

कॉल कॉलर (); इस तरह से पेज में अपना ऑब्जेक्ट बनाने के बाद

 $('<dom class="ObjectYouWntToCall">bla... bla...<dom>').appendTo("#whereeveryouwant"); caller(); 

इस तरह से आपका फ़ंक्शन कहलाता है जब पृष्ठ पर हर क्लिक नहीं करना चाहिए।