单个表单上的两个提交按钮

库莱班库苏

是否可以在一个表单上有两个提交按钮，其中一个启动提交但还向URL传递参数？也许使用js / jquery拦截操作并以某种方式附加参数。IE，

<form action="/doStuff" method="post">
    <input id="name" type="text"></input>
    <button id="save" type="submit">Save</button>
    <button id="save-with-param" type="submit">Save as Draft</button>
</form>

单击保存将发送：

localhost:8080/myApp/doStuff

然后单击save-with-param将发送：

localhost:8080/myApp/doStuff?param=XYZ

沃尔夫

在所有现代浏览器上，您可以使用formactionattribute：

<form action="/doStuff" method="post">
    <input id="name" type="text"></input>
    <button id="save" type="submit">Save</button>
    <button id="save-with-param" type="submit" formaction="/doStuff?param=XYZ">Save as Draft</button>
</form>

为了支持较旧的浏览器，例如IE9 <，您可以使用以下方法添加支持：

;(function ($) {
    $(function () {
        if (typeof document.createElement('input').formAction === "undefined") {
            $(':submit[formaction]').closest('form').data('defaultFormAction', this.action).on('submit', function () {
                var $focused = $(':focus');
                $(this).attr('action', $focused.is('[formaction]') ? $focused.attr('formAction') : $(this).data('defaultFormAction'));
            });
        }
    });
}(jQuery));

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。