Question

我有一张包含以下内容的表格：

<form id="my-form" ...>
    ...
    <button type="submit" name="bttnsubmit" value="1">The first button</button>
    <button type="submit" name="bttnsubmit" value="2">The last button</button>
</form>

我想用以下方法检测哪个触发了表单提交事件：

$('#my-form').submit(function(){
    //psuedo code
    if($('[name=bttnsubmit]').val() == 1) {
        ....
    }
});

显然，选择器将始终返回它遇到的第一个bttnsubmit元素的值，所以我需要一些其他魔术选择器或过滤器等。

我看到$('[name=bttnsubmit][clicked=true]')被吹捧但是我的尝试还没有奏效......

我当然可以诉诸$('[name=bttnsubmit]').click()，但我希望能够在表格提交活动中实现我的目标。

非常感谢任何帮助/提示。

Answer 1

我不知道是否有任何内置事件数据（可能存在），但我想到的一个想法是处理按钮的click事件并存储值的全局引用。像这样：

var ButtonValue;

$('button[type="submit"]').click(function(e){
   ButtonValue = $(this).val();
});

$('#my-form').submit(function(){
    //psuedo code
    if(ButtonValue == 1)
    {
        ....
    }
});

Answer 2

这个答案是@ musefan的答案的改进。

避免全局变量。保持数据形式更好：

$('button[type=submit]').click(function (e) {
    var button = $(this);
    buttonForm = button.closest('form');
    buttonForm.data('submittedBy', button);
});

在提交处理程序中，只需获取它：

$('#my-form').submit(function (e) {
    var form = $(this);
    var submittedBy = form.data('submittedBy');
    if(submittedBy.val() == 1) {
        // Any code here...
    }
});

表格可以通过点击“输入”来提交。要避免null变量中的submittedBy：

var submittedBy = form.data('submittedBy') || form.find('button[type=submit]:first');

Answer 3

关于你的陈述：

我已经看到$（'[name = bttnsubmit] [clicked = true]'）被吹捧但是我的尝试还没有起作用......

我发现其他地方没有正确解释。这不是一件自动的事情。您仍需要通过在单击提交按钮时添加“单击”属性来进行设置。

$("#my-form input[type=submit]").click(function () {
    $("input[type=submit]", $(this).parents("form")).removeAttr("clicked");
    $(this).attr("clicked", "true");
});
$("#my-form").submit(function () {
    var clickedSubmitValue = $("input[type=submit][clicked=true]").val();
    if (clickedSubmitValue == "1")
    {
        ...
    }
});

与示例here类似。

jquery检测哪个按钮提交了表单

3 个答案: