2010-02-02 16 views
35

मैं, जावास्क्रिप्ट का उपयोग कर एक iframe तत्व बनाने के इतने तरह की कोशिश कर रहा था का उपयोग कर एक iframe पर प्रपत्र सबमिट करना:आईई मुद्दा: जावास्क्रिप्ट

var iframe = document.createElement('iframe'); 
iframe.setAttribute('name', 'frame_x'); 

हालांकि, जब मैं एक पर्चे को जमा लक्ष्य के रूप में नव निर्मित iframe उपयोग करने की कोशिश , IE आईफ्रेम का उपयोग करने के बजाय, एक नई विंडो खुलता है।

form.setAttribute('target', 'frame_x'); 
form.submit(); 

यह फ़ायरफ़ॉक्स में पूरी तरह से काम करता है। इसके अलावा, iframe बनाया जाता है, लेकिन इसका उपयोग नहीं किया जाता है।

उत्तर

74

आप एक bug in Internet Explorer पर पहुंच जाते हैं: यहाँ संस्करण है कि IE और Firefox के साथ काम करता है।

आप नहीं IE में किसी भी तत्व का नाम विशेषता सेट मानक डोम विधि .setAttribute('name', value);

का उपयोग कर IE में कर सकते हैं इस विधि (संस्करण 8 IE8 मानकों मोड में चलाने से पहले) नहीं होगा नाम विशेषता सेट करने के लिए काम करें।

var iframe = Element('iframe', {name: 'frame_x'}); 

जो काम करता है इस सहायक समारोह का पता लगाता है क्योंकि HAS_EXTENDED_CREATE_ELEMENT_SYNTAX: अगर Prototype.js का उपयोग कर,

//A (any browser) 
var iframe = document.createElement('iframe'); 
iframe.name = 'frame_x'; 

//B (only in IE) 
var iframe = document.createElement('<iframe name="frame_x"/>'); 

//C (use a JS library that fixes the bug (e.g. jQuery)) 
var iframe = $('<iframe name="frame_x"></iframe>'); 

//D (using jQuery to set the attribute on an existing element) 
$('iframe:first').attr('name','frame_x'); 
+2

+1 अच्छी जानकारी .. धन्यवाद –

+3

धन्यवाद स्कैनलिफ़। यह एक बहुत ही उपयोगी जानकारी है। – Erwin

+1

+1 - मेरे दिमाग में सही जवाब यहाँ है। –

7

SO में आपका स्वागत है।

आपके कोड में मैंने जो एक मुद्दा देखा वह यह है कि आप वास्तव में आईफ्रेम प्रदर्शित नहीं कर रहे हैं। इसे पृष्ठ पर प्रदर्शित करने के लिए, आपको इसे अपने दस्तावेज़ में डालना होगा। मेरे उदाहरण में, मैं <span> टैग स्लॉट के रूप में कार्य करने के लिए बनाता हूं जहां आईफ्रेम डाला जाएगा।

देखें कि यह क्या है जो आप खोज रहे हैं।

<!-- http://stackoverflow.com/questions/2181385/ie-issue-submitting-form-to-an-iframe-using-javascript --> 

<html> 
<head> 
<script type="text/javascript"> 
function submitFormToIFrame(){ 
    var form=document.getElementById('myform'); 
    form.setAttribute('target', 'frame_x'); 
    form.submit(); 
} 
</script> 
</head> 

<body> 
<h1>Hello Erwin!</h1> 

<form id="myform" name="myform" action="result.html"> 
    <input type="button" value="Submit the Form" onClick="submitFormToIFrame();"> 
</form> 


<span id="iframeSlot"> 

<script type="text/javascript"> 
    var iframe = document.createElement('iframe'); 
    iframe.setAttribute('name', 'frame_x'); 
    document.getElementById('iframeSlot').appendChild(iframe); 
</script> 
</span> 
</body> 
</html> 

अद्यतन:

मैंने पाया कि इस समाधान केवल फ़ायरफ़ॉक्स में काम कर रहा है। तो मैंने कुछ प्रयोग किया। ऐसा लगता है कि यदि आप एचटीएमएल में आईफ्रेम को परिभाषित करते हैं (जेएस/डीओएम के माध्यम से इसे उत्पन्न करने के बजाय) तो यह काम करता है।

<html> 
<head> 
<script type="text/javascript"> 
function submitFormToIFrame(){ 
    //IE 
    if(document.myform){ 
     document.myform.setAttribute('target','frame_x'); 
     document.myform.submit(); 
    //FF 
    } else { 
     var form=document.getElementById('myform'); 
     form.setAttribute('target', 'frame_x'); 
     form.submit(); 
    } 
} 
</script> 
</head> 

<body> 
<h1>Hello Erwin!</h1> 

<form id="myform" name="myform" action="result.html" target=""> 
    <input type="button" value="Submit the Form" onClick="submitFormToIFrame();"> 
</form> 

<span id="iframeSlot"> 
<iframe name="frame_x"> 
</iframe> 
</span> 
</body> 
</html> 
+0

हाय! जवाब के लिए धन्यवाद। दरअसल, मैंने अपनी पोस्ट में उस भाग को शामिल नहीं किया था जहां आईफ्रेम को एक div तत्व में जोड़ा जाता है, और दस्तावेज़। तत्व (appendChild का उपयोग करके) में तत्व शामिल होता है। यह देखते हुए कि आईफ्रेम पहले से ही शरीर में जोड़ा गया है, फॉर्म अभी भी आईफ्रेम को लक्षित नहीं कर रहा है। लेकिन यह केवल आईई में होता है। – Erwin

+0

@Ewin, आप बिल्कुल सही हैं। मैं इसके साथ प्रयोग कर रहा हूं और मैंने अपना जवाब अपडेट किया है। आशा करता हूँ की ये काम करेगा। –

+0

यह काम किया! अच्छा है। हालांकि, मेरे पास अभी भी कुछ अनसुलझे प्रश्न हैं। क्या अंतर हो सकता था?क्या यह फ़ॉर्म ऑब्जेक्ट का संदर्भ देने के लिए पर्याप्त नहीं है (इस मामले में getElementById का उपयोग करके)? इसके अलावा, जब मैंने जावास्क्रिप्ट का उपयोग करके फॉर्म बनाने का प्रयास किया, तो HTML के अंदर एक फॉर्म तत्व रखने के बजाय, वही समस्या फिर से हुई। लेकिन इस बार, आईई/एफएफ कार्यान्वयन के लिए अगर अन्यथा खंड अब काम नहीं कर रहा है। कोई उपाय? लेकिन फिर भी, उत्तर के लिए धन्यवाद! – Erwin

0
function sendForm(idform){ 
    var nfi = "RunF"+tagRandom(); 
    $("body").append("<iframe name=\""+nfi+"\" id=\""+nfi+"\" class=\"runAgents\" src=\"#\"></iframe>"); 
    $("#"+idform).attr("target",nfi); 
    $("#"+idform).submit(); 
} 
+3

आपके उत्तर के साथ कुछ प्रकार की टिप्पणी जोड़ने में मददगार यह समझाने में मदद करता है कि आपका कोड कैसे मदद करता है। – RThomas

0

@ scunliffe के जवाब जारी रखने के लिए:

आप निम्न में से किसी एक का उपयोग करने की आवश्यकता है आईई के लिए, .name = … बग के आसपास काम कर रहा है।

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