Javascript 仅为一个表单提交操作设置目标 _blank
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13484528/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
setting target _blank for just one form submit action
提问by ipd
I'm submitting a form to my rails app, with two submit buttons. They both go to the same controller action, and use the same form, but on one submit action i want to make the form target=_blankso that the form submission results open in a new window.
我正在向我的 rails 应用程序提交一个表单，其中有两个提交按钮。他们都转到相同的控制器操作，并使用相同的表单，但是在一个提交操作中，我想制作表单，target=_blank以便在新窗口中打开表单提交结果。
Is there an easy way to do this?
是否有捷径可寻？
Doing this works for both actions:
这样做适用于两个操作：
<%= simple_form_for @thingy, :target => '_blank' do |f| %>
I've mucked around with using jQuery to set the target on the form onclick, but with no luck.
我一直在使用 jQuery 在表单上设置目标onclick，但没有运气。
回答by David Hellsing
On one of the buttons, add a class say popup. Then add some jQuery like this:
在其中一个按钮上，添加一个类 say popup。然后像这样添加一些jQuery：
$('.popup').click(function(e) {
e.preventDefault(); //prevents the default submit action
$(this).closest('form').attr('target', '_blank').submit();
});
Demo: http://jsfiddle.net/HxrzD/
演示：http: //jsfiddle.net/HxrzD/
Note that there are other ways to submit a form that you might need to consider, f.ex the enterkey. You also might need to reset the form's target attribute in case the user goes back to the parent window and submits again using the other button. In that case you can either just clear the target at the end:
请注意，您可能需要考虑其他提交表单的方法，例如enter密钥。您可能还需要重置表单的目标属性，以防用户返回父窗口并使用另一个按钮再次提交。在这种情况下，您可以在最后清除目标：
$(this).closest('form').attr('target', '_blank').submit().removeAttr('target');
Or save the previous state:
或者保存之前的状态：
var $form = $(this).closest('form'),
target = $form.attr('target');
$form.attr('target', '_blank').submit().attr('target', target);
回答by zb'
you can intercept click to the button, read it's data and change form before submit:
您可以拦截点击按钮，在提交之前读取它的数据并更改表单：
So, HTML:
所以，HTML：
<form id='double' method="GET" action="http://google.com/search">
<input name="q" type="text">
<button class="Submit" data-target=""> Submmit here</button>
<button class="Submit" data-target="_blank"> Open new</button>
</form>?
JS
JS
$('button.Submit').click( function() {
? ??var t=$(this);
? ??var form=t.parents('form');
? ??form.attr('target',t.data('target'));
? ??form.submit();
? ??return false;
});
this way you can control the target option in your html markup.
通过这种方式，您可以控制 html 标记中的目标选项。
http://jsfiddle.net/oceog/gArdk/
http://jsfiddle.net/oceog/gArdk/
in case if you not clear targetof the form, you will get the following scenario:
如果你不清除target表格，你会得到以下场景：
- user click on popup button,
- submitted the form,
- closed window,
- click on non-popup
- 用户点击弹出按钮，
- 提交了表格，
- 关闭的窗户，
- 点击不弹出
and that will also popup him form target.
这也会让他从目标中弹出。
so in my snipplet I clear target in case of data-target=''
所以在我的代码片段中，我清除了 data-target='' 的目标
if you want mark as popup only one element, you will need to clone your form: http://jsfiddle.net/oceog/gArdk/2/
如果您只想将一个元素标记为弹出窗口，则需要克隆您的表单：http: //jsfiddle.net/oceog/gArdk/2/
JS:
JS：
$('button.Submit.popup').click( function() {
? ??var t=$(this);
? ??var form=t.parents('form').clone(true).attr('target','_blank');
? ??
? ??form.submit();
? ??return false;
});
HTML:
HTML：
<form id='double' method="GET" action="http://google.com/search">
<input name="q" type="text">
<button class="Submit"> Submmit here</button>
<button class="Submit popup"> Open new</button>
</form>?
回答by Andrew Hubbs
In order to handle all submitcases (not just clicks) I would do something like the following:
为了处理所有submit情况（不仅仅是点击），我会执行以下操作：
$("form").submit(function(e) {
if($(e.srcElement).is(".popup")){
$(this).attr("target", "_blank");
}
});
