jQuery：如何获取表单提交时点击了哪个按钮？答案

【问题标题】：jQuery: how to get which button was clicked upon form submission?jQuery：如何获取表单提交时点击了哪个按钮？
【发布时间】：2011-08-08 23:13:20
【问题描述】：

我为表单提交设置了.submit() 事件。我在页面上也有多个表单，但在此示例中只有一个。我想知道点击了哪个提交按钮，而没有对每个按钮应用.click() 事件。

设置如下：

<html>
<head>
  <title>jQuery research: forms</title>
  <script type='text/javascript' src='../jquery-1.5.2.min.js'></script>
  <script type='text/javascript' language='javascript'>
      $(document).ready(function(){
          $('form[name="testform"]').submit( function(event){ process_form_submission(event); } );
      });
      function process_form_submission( event ) {
          event.preventDefault();
          //var target = $(event.target);
          var me = event.currentTarget;
          var data = me.data.value;
          var which_button = '?';       // <-- this is what I want to know
          alert( 'data: ' + data + ', button: ' + which_button );
      }
  </script>
</head>
<body>
<h2>Here's my form:</h2>
<form action='nothing' method='post' name='testform'>
  <input type='hidden' name='data' value='blahdatayadda' />
  <input type='submit' name='name1' value='value1' />
  <input type='submit' name='name2' value='value2' />
</form>
</body>
</html>

Live example on jsfiddle

除了在每个按钮上应用 .click() 事件外，有没有办法确定点击了哪个提交按钮？

【问题讨论】：

具有讽刺意味的是，这些信息对于确定服务器端来说当然是微不足道的。
@Neil 如果您通过 $.ajax() 和表单上的 serializeArray() 提交表单，则不会。
How can I get the button that caused the submit from the form submit event?的可能重复
如何在提交按钮上放置一个监听器并手动提交表单。
如何查看表单数据的序列化版本并匹配按钮的name？

标签： jquery forms

【解决方案1】：

这对我来说可以获取活动按钮

            var val = document.activeElement.textContent;

【讨论】：

【解决方案2】：

哇...很高兴在这里看到太多解决方案。但是 SubmitEvent 接口上有一个原生 Javascript 属性 submitter。 https://developer.mozilla.org/en-US/docs/Web/API/SubmitEvent/submitter

原生 Javascript

var btnClicked = event.submitter;

jQuery 版本

var btnClicked = event.originalEvent.submitter;

【讨论】：

【解决方案3】：

试试这个：

$(document).ready(function(){
    
    $('form[name="testform"]').submit( function(event){
      
        // This is the ID of the clicked button
        var clicked_button_id = event.originalEvent.submitter.id; 
        
    });
});

【讨论】：

这与一年前的另一个答案完全相同。它仅在为按钮分配 id 时才有效，但是，由于 event.originalEvent.submitter 是按钮，因此可以从中读取其他唯一分配的属性。

【解决方案4】：

您可以在提交表单时简单地获取事件对象。从中获取提交者对象。如下：

$(".review-form").submit(function (e) {
        e.preventDefault(); // avoid to execute the actual submit of the form.

        let submitter_btn = $(e.originalEvent.submitter);
        
        console.log(submitter_btn.attr("name"));
}

如果您想将此表单发送到后端，您可以通过 new FormData() 创建一个新的表单元素并设置按下按钮的键值对，然后在后端访问它。像这样 -

$(".review-form").submit(function (e) {
        e.preventDefault(); // avoid to execute the actual submit of the form.

        let form = $(this);
        let newForm = new FormData($(form)[0]);
        let submitter_btn = $(e.originalEvent.submitter);
        
        console.log(submitter_btn.attr("name"));

        if (submitter_btn.attr("name") == "approve_btn") {
            newForm.set("action_for", submitter_btn.attr("name"));
        } else if (submitter_btn.attr("name") == "reject_btn") {
            newForm.set("action_for", submitter_btn.attr("name"));
        } else {
            console.log("there is some error!");
            return;
        }
}

我基本上是在尝试创建一个表单，用户可以在其中批准或不批准/拒绝产品以用于任务中的进一步处理。我的 HTML 表单是这样的 -

<form method="POST" action="{% url 'tasks:review-task' taskid=product.task_id.id %}"
    class="review-form">
    {% csrf_token %}
    <input type="hidden" name="product_id" value="{{product.product_id}}" />
    <input type="hidden" name="task_id" value="{{product.task_id_id}}" />
    <button type="submit" name="approve_btn" class="btn btn-link" id="approve-btn">
        <i class="fa fa-check" style="color: rgb(63, 245, 63);"></i>
    </button>
    <button type="submit" name="reject_btn" class="btn btn-link" id="reject-btn">
            <i class="fa fa-times" style="color: red;"></i>
    </button>
</form>

如果您有任何疑问，请告诉我。

【讨论】：

【解决方案5】：

我能够通过 ASP.Net Core Web 应用在 Chrome 上使用 jQuery originalEvent.submitter：

我的 .cshtml 表单：

<div class="form-group" id="buttons_grp">
    <button type="submit" name="submitButton" value="Approve" class="btn btn-success">Approve</button>
    <button type="submit" name="submitButton" value="Reject" class="btn btn-danger">Reject</button>
    <button type="submit" name="submitButton" value="Save" class="btn btn-primary">Save</button>
    ...

jQuery 提交处理程序：

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<script type="text/javascript">
    $(document).ready(function() {
    ...
    // Ensure that we log an explanatory comment if "Reject"
    $('#update_task_form').on('submit', function (e) {
        let text = e.originalEvent.submitter.textContent;
        if (text == "Reject") {
           // Do stuff...
        }
    });
    ...

与我的 ASP.Net Core 环境捆绑在一起的 jQuery Microsoft 是 v3.3.1。

【讨论】：

【解决方案6】：

表单提交时：

document.activeElement 将为您提供被点击的提交按钮。
document.activeElement.getAttribute('value') 将为您提供该按钮的值。

请注意，如果通过按 Enter 键提交表单，则document.activeElement 将是当时关注的表单input。如果这不是提交按钮，那么在这种情况下，可能是没有“被点击的按钮”。

【讨论】：

请注意，这在 Safari 上似乎无法正常工作。 :(
我不知道 Safari 怎么样，但在 Chrome 上运行良好 :) 谢谢！
适用于 Chrome 63 和 IE11
我运行了 jquery 非侵入式验证，并在此之前拦截并将无效输入设置为 activeElement 而不是按钮。
好点@Daan：如果您通过按 Enter 提交表单，则可能不会成为“被点击的按钮”。 document.activeElement 仍然有效：在这种情况下，它为您提供提交表单的输入而不是按钮。我已经更新了答案以明确这一点。谢谢。

【解决方案7】：

这是我的解决方案：

   $('#form').submit(function(e){   
        console.log($('#'+e.originalEvent.submitter.id));
        e.preventDefault();
    });

【讨论】：

只有在为按钮分配了 id 时才会起作用，但是，由于 event.originalEvent.submitter 是按钮，因此可以从中读取其他唯一分配的属性。

【解决方案8】：

对于我的目的来说，这是一种看起来更简洁的方法。

首先，对于任何和所有形式：

$('form').click(function(event) {
  $(this).data('clicked',$(event.target))
});

当这个点击事件被一个表单触发时，它只是简单地记录了原始目标（在事件对象中可用）以供以后访问。这是一个相当广泛的笔触，因为它会在表单上的任何位置单击。欢迎优化 cmets，但我怀疑它永远不会引起明显的问题。

然后，在$('form').submit() 中，您可以查询上次点击的内容，例如

if ($(this).data('clicked').is('[name=no_ajax]')) xhr.abort();

【讨论】：

如果这是一个表单提交事件而不是点击怎么办？
@Tony，对不起，我没有早点看到你的问题。这个答案完全是关于表单提交的。提交按钮也会被点击，因此它们会触发点击事件。
赞成这个答案而不是hunter's answer，因为表单的提交事件在任何子元素点击事件之前被触发。当您的表单的提交事件被return false 取消时，这会导致困难，而此方法可以正常工作，因为单击绑定到表单而不是其子项。
这无法正确处理通过单击以外的方式提交表单的情况（例如，按 Enter）。当通过其他方式提交表单时，触发提交事件的是第一个提交按钮，而不是最后一次点击的按钮。
... $(event.target)) 后面缺少分号，但无法编辑，因为编辑必须> 6 个字符

【解决方案9】：

$('form').submit(function (ev) {
  let clickedButton = ev.originalEvent.explicitOriginalTarget;
});

【讨论】：

【解决方案10】：

我写了这个对我有帮助的函数

var PupulateFormData= function (elem) {
var arr = {};
$(elem).find("input[name],select[name],button[name]:focus,input[type='submit']:focus").each(function () {
    arr[$(this).attr("name")] = $(this).val();
});
return arr;
};

然后使用

var data= PupulateFormData($("form"));

【讨论】：

【解决方案11】：

这是一个示例，它使用 this.form 获取提交的正确表单，并使用数据字段存储最后点击/聚焦的元素。我还将提交代码包装在超时内，以确保在执行之前发生点击事件（一些用户在 cmets 中报告说，在 Chrome 上有时会在提交后触发点击事件）。

在使用键和鼠标/手指导航时都可以工作，而无需依靠浏览器在 RETURN 键上发送点击事件（虽然没有坏处），我为按钮和字段的焦点事件添加了一个事件处理程序。

您可以将 type="submit" 类型的按钮添加到单击时会自行保存的项目。

在演示中，我设置了一个红色边框来显示所选项目和一个显示名称和值/标签的警报。

这里是FIDDLE

这是（相同的）代码：

Javascript：

$("form").submit(function(e) {
  e.preventDefault();
  // Use this for rare/buggy cases when click event is sent after submit
  setTimeout(function() {

    var $this=$(this);
    var lastFocus = $this.data("lastFocus");
    var $defaultSubmit=null;

    if(lastFocus) $defaultSubmit=$(lastFocus);

    if(!$defaultSubmit || !$defaultSubmit.is("input[type=submit]")) {
      // If for some reason we don't have a submit, find one (the first)
      $defaultSubmit=$(this).find("input[type=submit]").first();
    }

    if($defaultSubmit) {
      var submitName=$defaultSubmit.attr("name");
      var submitLabel=$defaultSubmit.val();

       // Just a demo, set hilite and alert
      doSomethingWith($defaultSubmit);
      setTimeout(function() {alert("Submitted "+submitName+": '"+submitLabel+"'")},1000);
    } else {
      // There were no submit in the form
    }

  }.bind(this),0);

});

$("form input").focus(function() {
  $(this.form).data("lastFocus", this);
});
$("form input").click(function() {
  $(this.form).data("lastFocus", this);
});

// Just a demo, setting hilite
function doSomethingWith($aSelectedEl) {
  $aSelectedEl.css({"border":"4px solid red"});
  setTimeout(function() { $aSelectedEl.removeAttr("style"); },1000);
}

虚拟 HTML：

<form>
<input type="text" name="testtextortexttest" value="Whatever you write, sir."/>
<input type="text" name="moretesttextormoretexttest" value="Whatever you write, again, sir."/>

<input type="submit" name="test1" value="Action 1"/>
<input type="submit" name="test2" value="Action 2"/>
<input type="submit" name="test3" value="Action 3"/>
<input type="submit" name="test4" value="Action 4"/>
<input type="submit" name="test5" value="Action 5"/>
</form>

愚蠢的 CSS：

input {display:block}

【讨论】：

【解决方案12】：

区分哪个

$("button").click(function() {
  var id = $(this).attr('id');
  ... 
});

【讨论】：

【解决方案13】：

您可以创建 input type="hidden" 作为按钮 id 信息的持有者。

<input type="hidden" name="button" id="button">
<input type="submit" onClick="document.form_name.button.value = 1;" value="Do something" name="do_something">

在这种情况下，表单在提交时传递值“1”（按钮的 ID）。如果 onClick 发生在提交（？）之前，这有效，我不确定它是否总是正确的。

【讨论】：

【解决方案14】：

我发现最好的解决方案是

$(document.activeElement).attr('id')

这不仅适用于输入，也适用于按钮标签。它还获取按钮的 id。

【讨论】：

该死的，我必须看看我的页面现在是否可以在 Safari 上运行。为什么 Safari 总是这么难。感谢那。回家后去看看
developer.mozilla.org/en-US/docs/Web/API/DocumentOrShadowRoot/…
这在 Safari 中对我不起作用。单击正文中按钮上的侦听器调用表单上的 .submit。在提交处理程序内部$(document.activeElement).attr('id') 返回undefined
这不适用于键盘提交。例如。如果您专注于输入并按 Enter 提交表单。

【解决方案15】：

使用this excellent answer，您可以检查活动元素（按钮），将隐藏的输入附加到表单，并可选择在提交处理程序的末尾将其删除。

$('form.form-js').submit(function(event){
    var frm = $(this);
    var btn = $(document.activeElement);
    if(
        btn.length &&
        frm.has(btn) &&
        btn.is('button[type="submit"], input[type="submit"], input[type="image"]') &&
        btn.is('[name]')
    ){
        frm.append('<input type="hidden" id="form-js-temp" name="' + btn.attr('name') + '" value="' + btn.val() + '">');
    }

    // Handle the form submit here

    $('#form-js-temp').remove();
});

旁注：我个人在所有通过 JavaScript 提交的表单上添加了 form-js 类。

【讨论】：

【解决方案16】：

我也问过同样的问题：How can I get the button that caused the submit from the form submit event?

我最终想出了这个解决方案，而且效果很好：

$(document).ready(function() {
    $("form").submit(function() { 
        var val = $("input[type=submit][clicked=true]").val();
        // DO WORK
    });
    $("form input[type=submit]").click(function() {
        $("input[type=submit]", $(this).parents("form")).removeAttr("clicked");
        $(this).attr("clicked", "true");
    });
});

如果您有多个表单，您可能需要稍微调整一下，但它仍然应该适用

【讨论】：

+1 不错的解决方案。您可能需要添加一条语句，将按钮的 clicked 属性重置为 false，以防表单提交以 ajax 方式处理，并且您希望避免再次获得预先单击的按钮。
哦，我明白了。您正在添加自己的“点击”属性。我一直在寻找一个“点击”的布尔值，但在任何地方都找不到。我从来没想过自己做一个。好主意！
请注意，这只适用于输入元素，不适用于按钮元素。
这在带有按钮元素的 Chrome 中是不必要的。我只是处理 on submit 事件，从表单构造一个 FormData 对象，它总是包含被点击的按钮的值。 FireFox 没有表现出这种行为，而是根本不发送按钮值。 Chrome 似乎在自动执行类似上述解决方案的操作，记住单击了哪个按钮并将其自动包含在表单数据中。当然，这种缺乏标准行为（无论如何都会困扰 JavaScript 中的所有内容，所以我并不感到惊讶），使得该功能毫无用处。
另外，考虑添加选择器“button[type=submit]”（用逗号分隔），因为提交元素不必是输入标签。

【解决方案17】：

由于我无法对已接受的答案发表评论，因此我在这里带来了一个修改版本，该版本应考虑到表单之外的元素（即：使用form 属性附加到表单）。这适用于现代浏览器：http://caniuse.com/#feat=form-attribute。 closest('form') 用作不支持的 form 属性的后备

$(document).on('click', '[type=submit]', function() {
    var form = $(this).prop('form') || $(this).closest('form')[0];
    $(form.elements).filter('[type=submit]').removeAttr('clicked')
    $(this).attr('clicked', true);
});

$('form').on('submit', function() {
    var submitter = $(this.elements).filter('[clicked]');
})

【讨论】：

这确实应该是选择的答案。我只想补充一点，规则应该是"button,[type=submit]"
@Wil 但并非所有按钮都是提交按钮，这取决于它们的类型。
是的，但是在没有 ] 的情况下，我曾经使用过的每个 UA 都将

【解决方案18】：

这对我有用：

$("form").submit(function() {
   // Print the value of the button that was clicked
   console.log($(document.activeElement).val());
}

【讨论】：

这很有帮助，为了得到activeElement 的id，我做了$(document.activeElement).attr('id');
对于它的价值，你不需要使用 jQuery 来获取 id - 使用纯 Javascript 更简单：document.activeElement.id
请注意，这在 Safari 上似乎无法正常工作。 :(
@rinogo：Safari 会发生什么？
在 Safari 中 document.activeElement 不是输入。在我的例子中，它是一个模态 div（包含表单）。

【解决方案19】：

这是我使用的解决方案，效果很好：

// prevent enter key on some elements to prevent to submit the form
function stopRKey(evt) {
  evt = (evt) ? evt : ((event) ? event : null);
  var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
  var alloved_enter_on_type = ['textarea'];
  if ((evt.keyCode == 13) && ((node.id == "") || ($.inArray(node.type, alloved_enter_on_type) < 0))) {
    return false;
  }
}

$(document).ready(function() {
  document.onkeypress = stopRKey;
  // catch the id of submit button and store-it to the form
  $("form").each(function() {
    var that = $(this);

    // define context and reference
    /* for each of the submit-inputs - in each of the forms on
			 the page - assign click and keypress event */
    $("input:submit,button", that).bind("click keypress", function(e) {
      // store the id of the submit-input on it's enclosing form
      that.data("callerid", this.id);
    });
  });

  $("#form1").submit(function(e) {
    var origin_id = $(e.target).data("callerid");
    alert(origin_id);
    e.preventDefault();

  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<form id="form1" name="form1" action="" method="post">
  <input type="text" name="text1" />
  <input type="submit" id="button1" value="Submit1" name="button1" />
  <button type="submit" id="button2" name="button2">
    Submit2
  </button>
  <input type="submit" id="button3" value="Submit3" name="button3" />
</form>

【讨论】：

【解决方案20】：

对我来说，最好的解决方案是：

$(form).submit(function(e){

   // Get the button that was clicked       
   var submit = $(this.id).context.activeElement;

   // You can get its name like this
   alert(submit.name)

   // You can get its attributes like this too
   alert($(submit).attr('class'))

});

【讨论】：

【解决方案21】：

我也做了一个解决方案，效果很好：
它使用 jQuery 和 CSS

首先，我制作了一个快速的 CSS 类，它可以嵌入到单独的文件中。

<style type='text/css'>
    .Clicked {
        /*No Attributes*/
    }
</style>

接下来，在表单内按钮的单击事件中，将 CSS 类添加到按钮。如果按钮已经具有 CSS 类，请将其删除。（我们不想要两个 CSS 类 [以防万一]）。

    // Adds a CSS Class to the Button That Has Been Clicked.
    $("form :input[type='submit']").click(function () 
    {
        if ($(this).hasClass("Clicked"))
        {
            $(this).removeClass("Clicked");
        }
        $(this).addClass("Clicked");
    });

现在，测试按钮是否有 CSS 类，如果测试的按钮没有 CSS，那么另一个按钮会有。

    // On Form Submit
    $("form").submit(function ()
    {
        // Test Which Button Has the Class
        if ($("input[name='name1']").hasClass("Clicked"))
        {
            // Button 'name1' has been clicked.
        }
        else
        {
           // Button 'name2' has been clicked.
        }
    });

希望这会有所帮助！干杯！

【讨论】：

记得包含button[type=submit]和input[type=image]。
您应该删除对样式和 CSS 的引用 - 它们与此处无关。此外，您使用hasClass() 和removeClass() 的行是多余的，因为addClass() 不会将同一个类添加两次。

【解决方案22】：

这个对我有用

$('#Form').submit(function(){
var btn= $(this).find("input[type=submit]:focus").val();
alert('you have clicked '+ btn);

}

【讨论】：

这值得奖牌！
这与@Stan 提供的答案有何不同？

【解决方案23】：

它帮助了我https://stackoverflow.com/a/17805011/1029257

只有在点击提交按钮后才提交表单。

var theBtn = $(':focus');
if(theBtn.is(':submit'))
{
  // ....
  return true;
}

return false;

【讨论】：

【解决方案24】：

我发现这行得通。

$(document).ready(function() {
    $( "form" ).submit(function () {
        // Get the submit button element
        var btn = $(this).find("input[type=submit]:focus" );
    });
}

【讨论】：

这个解决方案在 Chrome 上运行良好，但不能在 Safari 上运行，它会返回 undefined，而不是按钮对象
@Krinkle 我这样编码是为了展示最通用的方式。我认为开发人员足够聪明，可以根据自己的喜好对其进行优化。
比其他解决方案更干净。仍然没有找到在按下回车时有效的解决方案
这个答案并不总是有效。实际上，您需要单击的按钮，而不是焦点（因为焦点操作不是单击操作）。选择的答案（猎人的）是正确的。
我在提交按钮上有一个点击事件并在他们的表单上提交事件......后者触发了前者。我用它来找出事件的来源。在某些浏览器中单击按钮，您将获得焦点，而在其他浏览器中，您将一无所获。在我测试的所有浏览器中，在输入时按回车键会使输入保持焦点。

【解决方案25】：

以 Stan 和 yann-h 所做的为基础，但这个默认为第一个按钮。这种整体方法的美妙之处在于它同时获取了单击和回车键（即使焦点不在按钮上。如果您需要允许在表单中输入，那么只需在按钮获得焦点时响应（即 Stan 的回答）。就我而言，即使用户当前的焦点在文本框上，我也希望允许 enter 提交表单。

我也使用了“name”属性而不是“id”，但这是相同的方法。

var pressedButtonName =
     typeof $(":input[type=submit]:focus")[0] === "undefined" ?
     $(":input[type=submit]:first")[0].name :
     $(":input[type=submit]:focus")[0].name;

【讨论】：

因此，如果您使用 TAB 将焦点移至第二个按钮并按 RETURN，它将默认为第一个按钮...

【解决方案26】：

类似于 Stan 的回答，但是：

如果您有多个按钮，则只需获取第一个按钮 => [0]
如果可以使用回车键提交表单，则必须管理一个默认值 => myDefaultButtonId

$(document).on('submit', function(event) {
    event.preventDefault();
    var pressedButtonId = 
         typeof $(":input[type=submit]:focus")[0] === "undefined" ? 
         "myDefaultButtonId" :
         $(":input[type=submit]:focus")[0].id;
    ...
 }

【讨论】：

【解决方案27】：

哇，有些解决方案可能会变得复杂！如果您不介意使用简单的全局，只需利用输入按钮单击事件首先触发的事实。可以使用 $('#myForm input') 进一步过滤 $('input') 选择器以获取多种表单之一。

    $(document).ready(function(){
      var clkBtn = "";
      $('input[type="submit"]').click(function(evt) {
        clkBtn = evt.target.id;
      });

      $("#myForm").submit(function(evt) {
        var btnID = clkBtn;
        alert("form submitted; button id=" + btnID);
      });
    });

【讨论】：

【解决方案28】：

$("form input[type=submit]").click(function() {
    $("<input />")
        .attr('type', 'hidden')
        .attr('name', $(this).attr('name'))
        .attr('value', $(this).attr('value'))
    .appendTo(this)
});

添加隐藏字段

【讨论】：

在 Firefox 30 / Windows 7 中不起作用。注意：现在在 Firefox 中需要一个隐藏字段，因为如果与 jquery 一起发送，它可能不会发送单击的提交值：this.submit() in an提交事件。我只是有点担心 $(this).attr('name') 可能不适用于所有浏览器。
我有 Firefox 30 / Windows 7。我的一切都运行良好。
记得包含button[type=submit]和input[type=image]。

【解决方案29】：

另一种可能的解决方案是在表单中添加一个隐藏字段：

<input type="hidden" id="btaction"/>

然后在准备好的函数中添加函数来记录按下了什么键：

$('form#myForm #btnSubmit').click(function() {
    $('form#myForm #btaction').val(0);
});

$('form#myForm #btnSubmitAndSend').click(function() {
    $('form#myForm #btaction').val(1);
});

$('form#myForm #btnDelete').click(function() {
    $('form#myForm #btaction').val(2);
});

现在在表单提交处理程序中读取隐藏变量并根据它做出决定：

var act = $('form#myForm #btaction').val();

【讨论】：

【解决方案30】：

如果您不添加 .click 事件的意思是您不想为这些事件使用单独的处理程序，您可以在一个函数中处理所有点击（提交）：

$(document).ready(function(){
  $('input[type="submit"]').click( function(event){ process_form_submission(event); } );
});

function process_form_submission( event ) {
  event.preventDefault();
  //var target = $(event.target);
  var input = $(event.currentTarget);
  var which_button = event.currentTarget.value;
  var data = input.parents("form")[0].data.value;
//  var which_button = '?';       // <-- this is what I want to know
  alert( 'data: ' + data + ', button: ' + which_button );
}

【讨论】：

不错的主意。这适用于页面上的任意数量的表单吗？
@hawk 是的，应该。我不知道这是否是所需的行为，但您的代码实际上并没有提交表单，所以我的也没有。如果您确实想提交它，只需删除event.preventDefault 或执行input.parents("form")[0].submit() 之类的操作。
如果你没有点击就提交（回车键？）那将是一团糟..