获取点击提交按钮的价值

Question

我尝试从公式编辑器中获取两个提交按钮之一的值，但是我在每种情况下都尝试执行失败。

希望有人能帮助我，告诉我我该怎么做。

这是html表格

<form id="new_contact" class="save_form" action="kontaktdetails.php?art='.$_POST['art'].'" method="post" > 
   <button class="btn" id="submit1" type="submit" name="save_close">Save and close<i class="fa fa-save-right"></i></button>
   <button class="btn" id="submit2" type="submit" name="save_next">Save and next one<i class="fa fa-save-right"></i></button>
</form>

这是JS代码，在这里我需要单击按钮的名称或ID

$(document).on('submit', '.save_form', function (event) {
  event.preventDefault();      
//    var submitbutton = !????
  var formID = $(this).attr('id');
  var formDetails = $('#'+formID);   
  var fileurl = $(this).attr('action');
  ...

Answer 1

有许多方法可以执行此操作，一种方法是在单击之前在提交之前向按钮添加事件处理程序，然后使用类或其他方法来识别在提交处理程序中单击了哪个按钮。
这样，您仍然可以捕获并阻止未从按钮启动的提交。

如果您不需要专门捕获提交，则可以对按钮使用事件处理程序，而不是表单提交

 $(document).on('click', '.save_form button', function() { $('.save_form button').removeClass('clicked'); $(this).addClass('clicked'); }); $(document).on('submit', '.save_form', function(event) { event.preventDefault(); var formID = $(this).attr('id'); var formDetails = $('#' + formID); var fileurl = $(this).attr('action'); var id = $(this).find('button.clicked').prop('id'); alert(id) }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="new_contact" class="save_form" action="kontaktdetails.php?art='.$_POST['art'].'" method="post"> <button class="btn" id="submit1" type="submit" name="save_close">Save and close<i class="fa fa-save-right"></i> </button> <button class="btn" id="submit2" type="submit" name="save_next">Save and next one<i class="fa fa-save-right"></i> </button> </form> 

Answer 2

尝试将事件绑定到提交按钮，如下所示：

 $('.save_form').on('click', '[type=submit]', function(event) { event.preventDefault(); var submitbutton = $(this).attr('id'); var formDetails = $(this).closest('form'); var formID = formDetails.attr('id'); var fileurl = formDetails.attr('action'); console.log(submitbutton); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <form id="new_contact" class="save_form" action="kontaktdetails.php?art='.$_POST['art'].'" method="post"> <button class="btn" id="submit1" type="submit" name="save_close">Save and close<i class="fa fa-save-right"></i> </button> <button class="btn" id="submit2" type="submit" name="save_next">Save and next one<i class="fa fa-save-right"></i> </button> </form> 

Answer 3

假设您有下面的表格，

<form id="sForm">
      <input type="text" name="toSearch" id="toSearch" />
      <input type="submit" id="mysubmit"/>
 </form>

并且您想在提交表单时检索值。在我的示例中，输入的ID名为“ toSearch”。 只需执行以下操作。

$('#sForm').on("submit",function(e){
var myvar = $('#toSearch').val();
//Now you can do anything you wish with the variable myvar
//  Put more code here.

  e.preventDefault();

});

该值将在提交时检索，但是您可以将其更改为Onclick或任何其他类型的操作。

希望对你有帮助