jQuery:如何获得哪个按钮被点击提交的表单?

我有一个.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>

jsfiddle的实例

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

当前回答

你可以创建input type="hidden"作为按钮id信息的holder。

<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发生在提交(?)之前，这是有效的，我不确定它是否总是正确的。

2017-03-19 00:09:25

其他回答

以下是我的解决方案:

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

2020-05-17 04:35:12

下面的方法似乎更符合我的目的。

首先，对于任何形式:

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

当为表单触发此单击事件时，它只是记录稍后要访问的原始目标(在事件对象中可用)。这是一个相当宽泛的描边，因为它将在表单上的任何地方触发任何单击。欢迎提供优化评论，但我怀疑它永远不会引起明显的问题。

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

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

2011-07-29 19:15:04

这是我使用的解决方案，效果非常好:

// 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>

2015-01-07 15:25:11

我发现最好的解决办法是

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

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

2016-11-29 10:10:25

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

添加隐藏字段

2014-02-15 15:16:28

jQuery:如何获得哪个按钮被点击提交的表单?

推荐文章

最新文章

标签