如何在表单提交上打开一个新窗口

Question

我有一个提交表单,并希望它在用户提交表单时打开一个新窗口,以便我可以在分析上跟踪它.

这是我正在使用的代码:

<form action="http://URL at mailchimp subscriber URL.com" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" onclick=window.open(google.html,'','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');>
    <label for="name">Your Name</label><input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
    <br/>
    <br/>
    <label for="email">Your Email </label><input type="text" value="" name="EMAIL" class="required email" id="mce-EMAIL">
    <br/>
    <br/>
    <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="submit">
</form>
</div>

Answer 1

不需要Javascript,您只需target="_blank"在表单标记中添加属性即可.

<form target="_blank" action="http://example.com"
      method="post" id="mc-embedded-subscribe-form"
      name="mc-embedded-subscribe-form" class="validate"
>

Answer 2

在基于Web的数据库应用程序中,使用弹出窗口显示数据库数据的打印输出,这足以满足我们的需求(在Chrome 48中测试):

<form method="post" 
      target="print_popup" 
      action="/myFormProcessorInNewWindow.aspx"
      onsubmit="window.open('about:blank','print_popup','width=1000,height=800');">

诀窍是target将<form>标记上的属性与处理程序中window.open调用中的第二个参数进行匹配onsubmit.

Answer 3

onclick可能不是将该行动附加到的最佳事件.无论何时任何人点击表单中的任何地方,它都会打开窗口.

<form action="..." ...
    onsubmit="window.open('google.html', '_blank', 'scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');return true;">

Answer 4

要获得与表单target属性相似的效果，您还可以使用或的formtarget属性。input[type="submit]"button[type="submit"]

从MDN：

...此属性是名称或关键字，指示提交表单后在何处显示收到的响应。这是浏览上下文（例如，选项卡，窗口或嵌入式框架）的名称或关键字。如果指定了此属性，它将覆盖元素表单所有者的目标属性。以下关键字具有特殊含义：

• _self：将响应加载到与当前响应相同的浏览上下文中。如果未指定属性，则此值为默认值。
• _blank：将响应加载到新的未命名浏览上下文中。
• _parent：将响应加载到当前响应的父浏览上下文中。如果没有父母，则此选项的行为与_self相同。
• _top：将响应加载到顶级浏览上下文（即，当前上下文的祖先且没有父级的浏览上下文）中。如果没有父母，则此选项的行为与_self相同。