Form Target _blank 在新页面和当前页面上提交答案

【问题标题】：Form Target _blank submits on both new page and current pageForm Target _blank 在新页面和当前页面上提交
【发布时间】：2014-02-01 03:23:34
【问题描述】：

我正在设置一个带有“提交”按钮和“预览”按钮的表单。

提交按钮一切正常。但是，预览按钮确实会打开一个带有预览的新页面，但它也会提交到实际表单页面上的相同预览，这不是我想要的，因为用户丢失了所有工作数据。

允许这样做的 JQuery 代码如下：

<script type="text/javascript">
jQuery(document).ready(function ($) {
$( ":button" ).click(function(){
    var url = $(this).attr('data-url');
    if(url=="{{ URL::to('customdownloadpage/preview') }}") {
        $('#formCustom').target = "_blank";
    }
    $('#formCustom').attr('action',url);   
    $('#formCustom').submit();
});
});
</script>

按钮的 HTML 如下：

<button data-url="{{ URL::to('customdownloadpage/new') }}" class="btn btn-primary">I'm Finished</button>
<button data-url="{{ URL::to('customdownloadpage/draft') }}" class="btn btn-primary">Save Draft</button>
<button style="float:right" data-url="{{ URL::to('customdownloadpage/preview') }}" class="btn btn-default">Preview</button>

为什么表单会提交两次（在_blank 页面上和在自身上）？

【问题讨论】：

标签： php jquery html forms laravel

【解决方案1】：

尝试阻止默认提交：

$( ":button" ).click(function(e){
    var url = $(this).attr('data-url');
    if(url=="{{ URL::to('customdownloadpage/preview') }}") {
        $('#formCustom').target = "_blank";
        e.preventDefault();
    }
    $('#formCustom').attr('action',url);   
    $('#formCustom').submit();
});

【讨论】：

【解决方案2】：

使预览按钮成为锚标记而不是按钮。按钮似乎总是作为表单内的提交触发器，所以如果你使用带有 btn 类的标签，你会得到一个没有所有事件的按钮的外观。

【讨论】：