javascript - Dynamic Iframe IE Name Issue - Stack Overflow

admin管理员组

文章数量:1391947

This seems to be a mon issue, and the solutions which I have seen do not seem to be working for me.

We've got a dynamically generated and inserted iframe, with a form which submits to it. Works fine in FF and IE8, but in 7 we are getting the iframe name issue (IE does not want to set iframe name using element.name or element.setAttribute("name",) ).

So I've converted our code over to this:

function insertTrafRepiFrame(){
    var contDiv = document.getElementById('trafficReportDiv');
    if(contDiv != null){
        var iFrame;
        try{
            iFrame = document.createElement('IFRAME');
        }catch(ex){
            iFrame = document.createElement('<iframe name="trafficreport">');                                        
        }
        iFrame.name = "trafficreport";
        iFrame.id = "trafficreport";
        iFrame.style.border = 0;
        iFrame.src = ".aspx?road=all%38map=small%38latitude=51.1421%38longitude=-0.07545%38radius=50%38roadsearch=no%38roadlink=yes%38reporttype=full";
        while(contDiv.hasChildNodes()){
            contDiv.removeChild(contDiv.firstChild);
        }
        contDiv.appendChild(iFrame);
    }
}

With this form:

<form name="traffic_report" id="traffic_report" target="trafficreport" action=".aspx" onsubmit="javascript:return CheckResponse(this);" method="get">
    <div id="trafficRepFormInps">
        <input type="hidden" name="map" value="small" />
        <input type="hidden" name="roadsearch" value="no" />
        <input type="hidden" name="roadlink" value="yes" />
        <input type="hidden" name="reporttype" value="full" /><br />
        <label for="road">Type a road below, i.e. M23:</label><br />                           
        <input name="road" value="M23" id="road" class="citysearchbox" type="text" /> 
    </div>
</form>

What I have noticed is that in developer tools, IE in 7 mode shows the iframe an attribute of submitName, where as 8 mode shows an attribute of propdescName. Could this discrepancy be causing this form misfiring? Or have I missed out on something else?

Thanks, Psy

(PS. No moans about iFrame over iframe variable name please :p )

This seems to be a mon issue, and the solutions which I have seen do not seem to be working for me.

We've got a dynamically generated and inserted iframe, with a form which submits to it. Works fine in FF and IE8, but in 7 we are getting the iframe name issue (IE does not want to set iframe name using element.name or element.setAttribute("name",) ).

So I've converted our code over to this:

function insertTrafRepiFrame(){
    var contDiv = document.getElementById('trafficReportDiv');
    if(contDiv != null){
        var iFrame;
        try{
            iFrame = document.createElement('IFRAME');
        }catch(ex){
            iFrame = document.createElement('<iframe name="trafficreport">');                                        
        }
        iFrame.name = "trafficreport";
        iFrame.id = "trafficreport";
        iFrame.style.border = 0;
        iFrame.src = "http://www.frixo./widget/widget-report-area.aspx?road=all%38map=small%38latitude=51.1421%38longitude=-0.07545%38radius=50%38roadsearch=no%38roadlink=yes%38reporttype=full";
        while(contDiv.hasChildNodes()){
            contDiv.removeChild(contDiv.firstChild);
        }
        contDiv.appendChild(iFrame);
    }
}

With this form:

<form name="traffic_report" id="traffic_report" target="trafficreport" action="http://www.frixo./widget/widget-report.aspx" onsubmit="javascript:return CheckResponse(this);" method="get">
    <div id="trafficRepFormInps">
        <input type="hidden" name="map" value="small" />
        <input type="hidden" name="roadsearch" value="no" />
        <input type="hidden" name="roadlink" value="yes" />
        <input type="hidden" name="reporttype" value="full" /><br />
        <label for="road">Type a road below, i.e. M23:</label><br />                           
        <input name="road" value="M23" id="road" class="citysearchbox" type="text" /> 
    </div>
</form>

What I have noticed is that in developer tools, IE in 7 mode shows the iframe an attribute of submitName, where as 8 mode shows an attribute of propdescName. Could this discrepancy be causing this form misfiring? Or have I missed out on something else?

Thanks, Psy

(PS. No moans about iFrame over iframe variable name please :p )

• javascript
• iframe

Share Improve this question Follow asked Jan 26, 2010 at 9:47 PsytronicPsytronic 6,11355 gold badges3939 silver badges5656 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

I think you do it right with the document.createElement('<iframe name="trafficreport">');

But I'm not sure it is called as the document.createElement('IFRAME') will be ok, even in IE.

We are using a dynamic iframe to sandbox cross domain JSONP calls, and it works fine in IE. The code I use is:

var ifr = (/MSIE (6|7|8)/).test(navigator.userAgent) ? 
    document.createElement('<iframe name="'+id+'">'):
    document.createElement('iframe');
    ifr.name = id;

You can check a working example here click on the Demo link. If the demo works it means something is wrong in your code, if it doesn't work, something is wrong with your IE configuration.

The only solution that worked for me was changing the name after the element has been injected into DOM by doing this:

window.frames[name].name=name;

本文标签： javascriptDynamic Iframe IE Name IssueStack Overflow