Iframe 中的表单未使用 Jquery 在 IE11 中提交

Posted 2023-05-09

【中文标题】Iframe 中的表单未使用 Jquery 在 IE11 中提交

【英文标题】：Form within Iframe not submitted in IE11 using Jquery

【发布时间】：2016-02-21 13:53:44

【问题描述】：

从下面的代码来看，alert函数应该在表单提交之后执行。但它是第一次执行，之后就不会了。它在除IE11之外的所有浏览器中都可以正常执行。

代码：

<iframe id="iframeID">
<form id="profile">
<input type="file" id="UPLOADED_FILE" name="UPLOADED_FILE" value="" >
<input type="submit" name="save_photo" value="Save" onclick="pressUpload();">
</form>
</iframe>

function pressUpload() 
    var iframe_document = document.getElementById('iframeID').contentWindow.document;
    var form_profile = $(iframe_document).find('#profile');
    var file_input_field = $(form_profile).find('input[name=UPLOADED_FILE]');

    $(file_input_field).bind('change', function () 
        var value = $(this).val();

        if (value) 

            $(form_profile).submit();


            if (navigator.userAgent.indexOf("MSIE") > -1 && !window.opera) 
                iframe.onreadystatechange = function () 
                    if (iframe.readyState == "complete") 

                        alert("HI");
                    
                ;
            
        
    )

【参考方案1】：

这是编写标记的无效方式。 但您不应像在您的案例中那样在 iframe 的开始/结束标签之间使用任何元素。

实际上只有在任何浏览器都不支持此元素时才会执行。 @MDN you can see the example1

<iframe src="page.html"  >
 <p>Your browser does not support iframes.</p>
</iframe>

【讨论】：

我像这样动态地创建和 iframe 和表单。 var iframe = document.createElement("iframe"); iframe.id = 'iframeID'; iframe.width = '0'; iframe.height = '0'; $('#iframe-container').append(iframe); //必须是https// iframe.src = '/account/includes/profile_picture-popup_upload.tmpl';在源文件中，我们上面提到了 iframe 表单格式。

但是为什么需要将表单放在 iframe 打开/关闭标签之间呢？如果您已经动态创建了它，那么您应该添加生成的标记，似乎您认为它。

查看表单上传图片是否完成