जावास्क्रिप्ट, छवि अधिभार() उसी छवि को लोड करते समय वेबकिट में आग नहीं डालता

Question

मेरे पास <img> तत्व है और मैं इसकी src विशेषता बदल रहा हूं। तत्व में onload हैंडलर फ़ंक्शन संलग्न है। प्रत्येक बार जब मैं src विशेषता बदलता हूं और छवि लोड करता है तो हैंडलर फ़ंक्शन चलाना चाहिए।

क्रोम और सफारी में, यदि मैं पहले जैसा ही एक ही स्रोत असाइन करता हूं, हैंडलर फ़ंक्शन नहीं चलाया जाता है। पहले से ही उसी स्रोत को असाइन करने से पहले मैंने imgElement.src='', imgElement.src= null, imgElement.src='notExistingFile.jpg' और कोई भी काम नहीं किया है।

कृपया मदद करें। किसी को भी इससे पहले समस्या थी?

संपादित: यह पहले की तरह ही src सौंपने से पहले imgElement.src = 'कर' से काम किया:

imgElement.src = ''; 
imgElement.src = 'image.jpg'; 

Answer 1

यह एक known bug है। यहां उस लिंक से वर्कअराउंड है:

यह कोई बग नहीं है। वेबकिट बस सख्त है। आप इस तरह, प्रतिस्थापन से पहले एक नया Image() वस्तु का दृष्टांत चाहिए :

var photo = document.getElementById('image_id'); 
var img = new Image(); 
img.addEventListener('load', myFunction, false); 
img.src = 'http://newimgsource.jpg'; 
photo.src = img.src; 

Answer 2

मुझे लगता है कि यहां आपकी समस्या सिर्फ इतना है कि आप ऑनलोड घटना बताए जाते हैं आप src मान बदलने के बाद, तो छवि एक बार है पहले से ही कैश में लोड हो चुका है, ब्राउज़र लोड घटना के असाइनमेंट से पहले है। इसका मतलब है कि बजाय ऐसा करने का:

myImageObject.src = "something.png"; 
myImageObject.onload = myCallback; 

ऐसा करते हैं:

myImageObject.onload = myCallback; 
myImageObject.src = "something.png"; 

Answer 3

img.addEventListener के मैट गेंद के जवाब देने के लिए जोड़ने के लिए, पर विचार img.onload बजाय()।

var photo = document.getElementById('image_id'); 
var img = new Image(); 
img.onload = myFunction; 
img.src = 'http://newimgsource.jpg'; 
photo.src = img.src; 

img.onload पढ़ने और उपयोगकर्ता एजेंटों में बेहतर काम करता है। सरल imgElement.src = '' समाधान के लिए