表单未提交到 iFrame，在新选项卡中打开答案

【问题标题】：Form not submitting to iFrame, opens in new tab表单未提交到 iFrame，在新选项卡中打开
【发布时间】：2011-11-10 09:01:45
【问题描述】：

我正在使用以下 html 开头的表单代码：

<form id="uploadpic" method="post" target="uppic" name="upform" action="/cgi-bin/inpost.cgi" enctype="multipart/form-data">

尝试加载页面，但页面会在新选项卡中打开。

我不认为这是问题的一部分，但无论如何我都会包括在内。这是表单中的提交按钮代码：

<input name="filename" id="filename" type="file" onchange="submitFormAfterImageCheck();" />

这是它调用的函数：

function submitFormAfterImageCheck()
            {
                if(/(\.jpeg|\.jpg|\.JPG|\.gif|\.png|\.tiff)$/.test(document.getElementById("filename").value))
                {
                    nogo = "go";
                    document.getElementById("uploadpic").submit();
                    $("#upload").html("<center>LOADING...</center>");
                    $('#link').hide();
                    $('#update_post').hide();

                }
                else
                {
                    alert("You can only upload an image.");
                }
            }

iFrame 代码：

<iframe id="uppic" name="uppic"></iframe>

为什么不提交到 iframe？

【问题讨论】：

是否有可能您正在加载的页面实际上是在 iframe 中加载的，但是新页面正在打开自己的窗口并显示在新标签中？
@Robert Martin...不，我不这么认为..

标签： javascript html forms iframe submit

【解决方案1】：

DIV 元素的位置似乎是个问题。虽然它被放置在表单标签中，但一旦提交表单，它就不会重定向。从表单标签中删除后，它重定向正常。

【讨论】：

您能否更详细地解释您的答案？我在原始问题中没有看到对 DIV 元素的引用。他们从哪里来？

【解决方案2】：

我也遇到了同样的问题并找到了解决方法。

当您静态设置表单的target 属性时（如您所做的那样），即使目标iframe 在同一窗口中，也会在新选项卡/窗口中收到响应。

您可以通过使用 javascript/jQuery 动态设置 form 的 target 属性来覆盖此设置。

javascript：

document.getElementById(formId).target = iframeId;

jQuery:

$("#formId").attr('target', iframeId);

希望这会有所帮助。

【讨论】：

<form> 的target 必须是<iframe> 的name=""，而不是<iframe> 的id=""。即document.getElementById( formId ).target = document.getElementById( iframeId ).name;

【解决方案3】：

如果您的 DOM 元素没有问题（正如@johndoe 在他的回答中指出的那样），并且在使用 Javascript 设置目标时仍然遇到问题（正如@naren 在他的回答中指出的那样），那么这应该可以解决问题：

给你的 iFrame 一个 name 属性并将你的表单目标设置为该值：

<iframe name="myTarget"></iframe>

<form target="myTarget" method="post" ...></form>

【讨论】：

我知道这是一个迟到的答案，但是这是这个问题的顶级谷歌结果，它并没有解决大多数情况下的问题