ऑनलोड बनाम addEventListener ('load') iframe व्यवहार

मैं एक पृष्ठ पर छिपे हुए आईफ्रेम तत्व जोड़ने के साथ खेल रहा हूं, और मैं इन लोड किए जाने के बाद इन दोनों के डीओएम में हेरफेर करना चाहता हूं। मैंने देखा है कि मैं किसी पृष्ठ पर आईफ्रेम जोड़ने के तुरंत बाद डीओएम में हेरफेर करना शुरू नहीं कर सकता क्योंकि यह अभी तक लोड नहीं हुआ है। यह DOMContentLoaded ईवेंट के साथ नहीं किया जा सकता है क्योंकि दस्तावेज़ के विरुद्ध आग लगती है जो पृष्ठ में जोड़े जाने तक आईफ्रेम में मौजूद नहीं है, इसलिए हमें load ईवेंट का उपयोग करना होगा।ऑनलोड बनाम addEventListener ('load') iframe व्यवहार

यहाँ कुछ परीक्षण कोड है:

var iframe = document.createElement('iframe'); 
iframe.onload = function() { console.log('loaded!'); }; 
document.getElementsByTagName('body')[0].appendChild(iframe);

यह अपेक्षा के अनुरूप है, लेकिन जब मैं इसे addEventListener करने के लिए बदल यह डोम को जोड़ा भी नहीं है काम करता है हो:

var iframe = document.createElement('iframe'); 
iframe.addEventListener('load', function() { console.log('loaded!'); }); 
document.getElementsByTagName('body')[0].appendChild(iframe);

मैं हेवन ' टी आईई में attachEvent का परीक्षण किया।

किसी ने इस पर कोई प्रकाश डाला?

स्रोत

2011-03-07 roryf

addEventListener() फ़ंक्शन को 3 तर्कों की आवश्यकता है! https://developer.mozilla.org/en/DOM/element.addEventListener

3 तर्क वैकल्पिक के रूप में चिह्नित किया गया है पर एक नजर डालें, लेकिन तब वे लिखते हैं:

ध्यान दें कि इस पैरामीटर सभी ब्राउज़र संस्करणों में वैकल्पिक नहीं है।

मुझे यकीन है कि कब और कहाँ यह आवश्यक है नहीं कर रहा हूँ, लेकिन जब addEventListener 2 के साथ बहस बुला FF4 पर अपना परीक्षण एक अपवाद दिए:

न आया हुआ अपवाद: [अपवाद ..."न पर्याप्त तर्क" nsresult: "0x80570001 (NS_ERROR_XPC_NOT_ENOUGH_ARGS)" स्थान: "जे एस फ्रेम :: http://localhost/index.php :: :: लाइन 10" डेटा: कोई]

वैसे, अपने कोड क्रोम में अच्छी तरह से काम करता है [स्ट्रिंग loaded! कंसोल में लॉग है]।

एफएफ की तरह, आईई 9 मानक मानकों में तीसरे तर्क की आवश्यकता है (<!DOCTYPE html> के साथ)। आईई 9 पहला आईई है जो डब्ल्यू 3 सी के इवेंट मॉडल का समर्थन करता है। तो पहले के संस्करणों में हमें attachEvent को आजमाने की आवश्यकता है। मेरे पास पहले आईई नहीं है, लेकिन यह आईई 7/8 मानक मोड में और आईई 9 में क्विर्क मोड में भी काम करता है। यहां कोड का उपयोग किया गया है:

<!DOCTYPE html> 
<html> 
<head><title></title></head> 
<body> 
<script> 
    window.onload=function(){ 
     var iframe = document.createElement('iframe'); 
     var func = function() { console.log('loaded!');}; 
     if(iframe.addEventListener) 
      iframe.addEventListener('load', func, true); 
     else if(iframe.attachEvent) 
      iframe.attachEvent('onload',func); 
     document.body.appendChild(iframe); 
    } 
</script> 
</body> 
</html>

स्रोत

2011-05-23 17:14:53

मेरा मानना है कि तीसरे पैरामीटर के बारे में आपका बिंदु बिल्कुल समस्या थी, मुझे आपके द्वारा की गई त्रुटि नहीं मिल रही थी, लेकिन शायद इसे किसी भी तरह दबाया जा रहा था। मुझे याद नहीं है लेकिन स्पष्ट रूप से मैंने क्रोम में इसका परीक्षण नहीं किया है (मूर्ख मुझे ...) अच्छा, धन्यवाद। – roryf

क्या पहला उदाहरण काम करता है? सुनिश्चित नहीं हैं कि आप के लिए वास्तव में क्या देख रहे हैं, लेकिन जब घटनाओं काम इस स्पष्ट करना चाहिए: jQuery document.ready स्रोत

$(document).ready equivalent without jQuery

addEventListener IE में काम नहीं करता है, इसलिए यदि यह है कि आप जहां परीक्षण कर रहे हैं, तो Iframe संलग्न होने से पहले दूसरा असफल हो जाएगा।

आप पृष्ठ से कॉलबैक भी जोड़ सकते हैं, हालांकि (उदाहरण के लिए, jQuery का उपयोग करके आप पहिया को फिर से नहीं चलाते) मुझे संदेह है कि $(iframe).ready() {..} आपको लगातार व्यवहार देगा।

स्रोत

2011-03-07 15:29:29

'तैयार' ईवेंट का उपयोग नहीं कर सकता है क्योंकि इसके लिए एक दस्तावेज़ की आवश्यकता है जो अभी तक मौजूद नहीं है, जब तक कि मुझे कुछ याद न हो। – roryf

मैं jquery दस्तावेज़ के रूप में एक ही तर्क का उपयोग करने का सुझाव दे रहा हूं। पहले से iframe तत्व पर, उदा। इस प्लगइन की तरह ऐसा लगता है: http://www.thunderguy.com/semicolon/2007/08/14/elementready-jquery-plugin/ लेकिन अभी भी स्पष्ट नहीं है कि आपके पहले कोड स्निपेट में कुछ गड़बड़ है, क्या आप हुक करने की कोशिश कर रहे हैं छवियों को लोड करने से पहले? वैकल्पिक रूप से, मानते हुए कि आप iframe में कोड को नियंत्रित करते हैं, तो आप दस्तावेज़ का उपयोग कर सकते हैं। पहले से ही पैरेंट का उपयोग करके फ़ंक्शन में कॉलबैक के लिए। –

पहला कोड स्निपेट सही तरीके से काम करता है (जैसा कि बताया गया था), हालांकि 'ऑनलोड' प्रॉपर्टी गैर-मानक (AFAIK) है और मुझे आश्चर्य हुआ कि मानक-अनुरूप तरीका (आईई को अनदेखा करना) क्यों काम नहीं कर रहा था। आईफ्रेम स्वयं किसी अन्य पृष्ठ पर इंगित नहीं करता है, मैं इसे खाली करना चाहता हूं और डोम को पॉप्युलेट करना चाहता हूं। – roryf

यह मेरे लिए काम कर रहा है:

एचटीएमएल:

iframe source code: <br /> 
<textarea id="output" rows="20" cols="60">loading ...</textarea>

(documentReady पर) जावास्क्रिप्ट:

var iframe = document.createElement('iframe'); 
iframe.id = iframe.name = "testframe"; 
iframe.src = "http://fiddle.jshell.net"; 
iframe.width = 400; 
iframe.height = 100; 
iframe.style.display = "none"; 

if (iframe.addEventListener) 
    iframe.addEventListener("load", loaded, false); 
else 
    iframe.attachEvent("onload", loaded); 

function loaded() { 
    var html; 
    if (iframe.contentDocument) 
     html = iframe.contentDocument.getElementsByTagName("HTML")[0].innerHTML; 
    else 
     html = window.frames[iframe.name].document.getElementsByTagName("html")[0].innerHTML; 

    document.getElementById("output").value = html; 
} 

document.getElementsByTagName("body")[0].appendChild(iframe);

पर डेमो देखें: addEventListener साथ http://jsfiddle.net/WcKEz/

काम करता है, लेकिन संलग्नक में फॉलबैक शामिल है। केवल उसी डोमेन पर IFRAME के DOM तक पहुंच।

स्रोत

2011-05-23 16:05:48 roberkules

ऑनलोड बनाम addEventListener ('load') iframe व्यवहार

उत्तर

संबंधित मुद्दे