表单发布后如何防止新窗口/标签打开答案

【问题标题】：How to prevent new window/tab opening after form post表单发布后如何防止新窗口/标签打开
【发布时间】：2014-02-13 21:28:33
【问题描述】：

我有一个表单提交，例如：

<form target="_blank" id="discussionForm" method="POST" enctype="multipart/form-data" action="<%=discussionURL%>">

最后我有一个提交按钮。这可行，它会发布到我的数据库，但它会打开一个新选项卡，其中包含我用来发布到数据库的服务的 url。我不想打开那个新标签。我尝试使用不同的目标，但我认为 _blank 会起作用。有什么建议么？

【问题讨论】：

删除：target="_blank"
如果我不使用 target="_blank"，它会替换当前标签，它不会启动新标签。我不希望它打开任何东西。
用户如何知道他们已经成功提交了表单？

标签： html forms post

【解决方案1】：

去掉target属性应该没问题。

target="_blank" 实际上意味着它应该在新标签/窗口中打开。

Documentation（请务必先阅读文档）

【讨论】：

如果我不使用 target="_blank"，它将用空白屏幕替换当前选项卡（我的 ReST 服务的响应）。我不希望它打开任何东西。想法？
@ZachLucas 你还没有说预期的行为是什么。在这种情况下，您可以捕获表单的submit 事件，阻止提交，并在后台使用 AJAX 发布数据。或者将表单重定向到隐藏的iframe - 这可以使用target 属性来完成，请查看我链接的文档:)。 forms 默认情况下是这样工作的，他们在 action 中打开页面，因此您必须阻止它（JS）或找到解决方法（iframe）。

【解决方案2】：

当您想显示提交此表单返回的内容但在另一个 page/container _blank|_self|_parent|_top|framename 时，您想使用此属性，我想它是在人们编写标记时构建的frames 给它一种 html 支持，现在使用/需要它非常奇怪。

“目标属性指定了一个名称或关键字，用于指示在哪里显示提交表单后收到的响应。” - W3Schools

【讨论】：

【解决方案3】：

如果有人没有target属性，可以添加onclick和onkeypress属性，如下图所示：

<form action="/Account/Login" class="form" method="post" onclick="return event.shiftKey !== true;" onkeypress="return !(event.keyCode === 13 && event.shiftKey);"> </form>

onclick 过滤掉任何“shift + click”。 onkeypress 可防止“shift + enter”。

【讨论】：

【解决方案4】：

我在这里为thread 之一添加了解决方案：

最近我遇到了这种情况并进行了很多研究以找到破解/解决方案。

解决方案 - 如果你可以输入一个窗口名称并且每次都引用相同的名称，那么浏览器将确保打开新标签（如果尚未打开），否则它只会刷新窗口。

示例 sn-p：Demo JSfiddle here

<form id="myForm" action="<URL>" method="POST" target="_blank" onsubmit="target_popup(this)">
    First name: <input type="text" name="fname"/><br/>
    Last name: <input type="text" name="lname"/><br/>
    <button type="submit" id="btnTest"> Submit</button>
</form>


<script>
var target_popup = function(form) {
    window.open('',//URL should be blank so that it will take form attributes.
                'UniqueWindowName', //window name
                'width=400,height=400,resizeable,scrollbars');
    form.target = 'UniqueWindowName';
}
</script>

详情请咨询我的blog

【讨论】：