jQuery.one() और jQuery.on()

Question

के बीच अंतर मेरे पृष्ठ पर कई छवियां हैं I टूटी हुई छवियों का पता लगाने के लिए, मैंने एसओ पर पाया।

$('.imgRot').one('error',function(){ 
    $(this).attr('src','broken.png'); 
}); 

यह पहली छवि पर ठीक काम करता है जो मैं समझता हूं। लेकिन जब मैं इसे

$('.imgRot').on('error',function(){ 
    $(this).attr('src','broken.png'); 
}); 

यह किसी भी छवि पर काम नहीं करता है। क्या कोई मुझे बता सकता है क्यों?

Answer 1

यदि आप jQuery 1.7 में .one() के लिए स्रोत कोड देखते हैं, तो यह आंतरिक रूप से .on() को आंतरिक रूप से कॉल करता है सिवाय इसके कि ईवेंट की आग के बाद, यह ईवेंट हैंडलर को हटा देता है। इसलिए, आपके मामले में कोई फर्क नहीं पड़ता क्योंकि error एक ऐसी घटना है जो प्रति वस्तु एक बार होनी चाहिए।

तो, आपके कोड में कुछ और चलना चाहिए जैसे कि छवि ऑब्जेक्ट को डोम में लोड नहीं किया गया है, फिर भी जब आप इस कोड को चलाते हैं या ऐसा कुछ करते हैं।

यदि आप ऐसा करने के लिए प्रतिनिधि ईवेंट हैंडलिंग का उपयोग करने का प्रयास कर रहे थे (जो आपका उदाहरण नहीं दिखाता है), तो आप उन समस्याओं में भाग ले सकते हैं जहां 'त्रुटि' ईवेंट प्रचार नहीं करता है।

यह भी हो सकता है कि आपके कोड में कैशिंग के कारण समय समस्याएं हो। इन प्रकार के त्रुटि हैंडलर को उन छवियों पर स्थापित करने का प्रयास कर रहे हैं जो पहले से ही डीओएम में हैं, एक दौड़ की स्थिति है। आप इसे कॉल करने से पहले त्रुटि हैंडलर स्थापित करने का प्रयास कर रहे हैं, लेकिन छवि लोड हो चुकी है और इवेंट हैंडलर स्थापित करने से पहले ईवेंट पहले ही निकाल दिया जा सकता है। बाद के पेज लोड (पहले के बाद) अन्य पेज तत्वों या DNS संदर्भों को कैश कर सकते हैं, इसलिए यह त्रुटि हैडलर को तेज़ी से प्राप्त कर सकता है और संभवतः आपके जेएस को चलाने और त्रुटि हैंडलर इंस्टॉल करने से पहले भी।

मुझे पता है कि यह ब्राउज़र कैशिंग और onload ईवेंट के साथ एक मुद्दा है। यदि आप ईवेंट हैंडलर को एम्बेडेड एचटीएमएल में संलग्न करते हैं तो आप केवल onload ईवेंट प्राप्त कर सकते हैं (इसलिए यह तब होता है जब <img> टैग पहले पार्स किया जाता है या यदि आप .src संपत्ति सेट होने से पहले इसे संलग्न करते हैं (यदि प्रोग्राम प्रोग्रामेटिक रूप से बनाते हैं)। यही कारण है कि सुझाव है कि आप नहीं मज़बूती से error संचालकों जिस तरह से आप छवियों के लिए कर रहे हैं कि HTML पेज में हैं निर्धारित कर सकते हैं कि

मेरे सुझाव इस होगा:।

• त्रुटि संचालकों स्थापित करने का प्रयास न करें छवियों के बाद डीओएम में हैं।
• यदि आप उन्हें प्रोग्रामेट पर असाइन करते हैं ically छवियों को उत्पन्न करना, फिर .src से पहले ईवेंट हैंडलर असाइन करें।
• यदि आपको पृष्ठ के HTML में छवियों पर इनकी आवश्यकता है, तो आपको इवेंट हैंडलर को HTML में कुछ <img src="xxx" onerror="yourErrorFunc(this)"> के साथ रखना होगा क्योंकि यह सुनिश्चित करने का एकमात्र तरीका है कि ईवेंट होने से पहले हैंडलर इंस्टॉल हो जाएं।

Answer 2

सामुदायिक विकी: यह सामान्य उत्तर ओपी पोस्ट किए गए सवाल में योगदान नहीं देता है लेकिन शीर्षक के सापेक्ष।

पर की एक() और अवधारणा() नीचे दिए कोड से समझाया जा सकता है।

one() फ़ंक्शन स्वचालित रूप से प्राप्ति के पहले उदाहरण के बाद राज्य से बाहर हो जाता है।

on() एक() के समान है लेकिन इसे मैन्युअल रूप से राज्य से बाहर करने की आवश्यकता है अन्यथा उदाहरणों की संख्या की कोई सीमा नहीं है।

var i = 1; 
 
$('.one').one('click', function() { 
 

 
    $(this).text('I am clickable only once: ' + i); 
 
    i++; 
 
}); 
 

 
var j = 1; 
 
$('.multiple').on('click', function() { 
 

 
    $(this).text('I was clicked ' + j + ' times'); 
 
    j++; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="one">Click me</div> 
 
<div class="multiple">Click me</div>

Answer 3

jQuery "एक" के लिए विधि "पर" का पुन: उपयोग होगा। JQuery का आंतरिक कोड निम्नलिखित है जहां वे jQuery.on() के फ़ंक्शन में हार्डकोडेड मान "1" से गुजरेंगे।) वे jQuery.off()

on:function(types, selector, data, fn, one) { 

    if (one === 1) { 
      origFn = fn; 
      fn = function(event) { 
      jQuery().off(event); 
      return origFn.apply(this, arguments); 
      }; 

    } 
    off:function(types, selector, data, fn){ 
     on(types, selector, data, fn, 1); 
    } 

का उपयोग कर तत्व पर आगे ट्रिगर किए गए ईवेंट को बंद कर देंगे।

तो, आपके मामले में "त्रुटि" घटना की पहली छवि पर ट्रिगर किया गया है और जब jQuery.one() विधि को यह ईवेंट कहा जाता है तो उसे $ ('imgRot') पर आगे बढ़ने के लिए ट्रिगर नहीं किया जाता है। तत्व