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="btaction"/>

然后在ready函数中添加函数来记录按下的键:

$('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();

2013-06-30 10:54:39

其他回答

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

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

然后在ready函数中添加函数来记录按下的键:

$('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();

2013-06-30 10:54:39

你想像这样使用window.event.srcElement.id:

function clickTheButton() {

var Sender = window.event.srcElement;
alert("the item clicked was " + Sender.id)

}

对于如下所示的按钮:

<input type="button" id="myButton" onclick="clickTheButton();" value="Click Me"/>

你会得到一个警告，上面写着:“点击的项目是我的按钮。

在改进的示例中，您可以将window.event.srcElement添加到process_form_submission中，这样就可以引用调用该流程的元素。

2011-04-19 19:51:39

如果你不添加.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 );
}

2011-04-19 19:54:45

类似于Stan的回答，但是:

如果你有多个按钮，你只能得到第一个按钮=> [0] 如果表单可以用enter键提交，你必须管理一个default => myDefaultButtonId

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

2014-03-04 14:26:09

这个方法对我很管用

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

}

2014-09-03 14:56:23

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

推荐文章

最新文章

标签