Question

假设我在网站上有很多html表单。我需要找出提交的HTML表单。

$("form").submit(function(event){ }

使用上述功能，我可以找出提交的表格吗？

Answer 1

您应该为表单指定一个可识别的属性，并使用event.target来访问该属性。

在这种情况下，我已经为每个表单分配了name，并在提交表单时在控制台上打印了名称。

$("form").submit(function(event) {
  event.preventDefault();
  console.log(event.target.name);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form name="form1">
  <button type="submit">submit</button>
</form>

<form name="form2">
  <button type="submit">submit</button>
</form>

<form name="form3">
  <button type="submit">submit</button>
</form>

Answer 2

即使建议使用ID，也可以不使用ID。您的event.target提供表单的参考。

$("form").on("submit", function(event){
event.preventDefault();
var a = $(event.target).children("input[type='text']").val();
console.log(a);
});

JSFiddle

感谢@ 31piy提醒它。

Answer 3

请查看以下链接，以确定提交不同的表单。

＆＃13;

$(document).ready(function() {
  $("#Form1").submit(function(event) {
    alert($(this).attr('id'));
    event.preventDefault();
  });

  $("#Form2").submit(function(event) {
    alert($(this).attr('id'));
    event.preventDefault();
  });

  $("#other").click(function() {
    $("#Form1").submit();
  });

  $("#other2").click(function() {
    $("#Form2").submit();
  });
});

＆＃13;

<!DOCTYPE html>
<html lang="en">

  <head>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>



  </head>

  <body>
    <form id="Form1" action="destination.html">
      <input type="text" value="Hello there">
      <input type="submit" value="Go">
      <div id="other">
        Click to trigger the handler for first form
      </div>
    </form>


    <form id="Form2" action="destination.html">
      <input type="text" value="Hello there">
      <input type="submit" value="Go">
      <div id="other2">
        Click to trigger the handler for second form
      </div>
    </form>


  </body>

</html>

＆＃13;

Answer 4

好问题。

我通常会将每个表单提交给不同的路由处理程序。这样我就能保留一些基本原则（单一责任原则）。否则，您的代码会变得太复杂，无法阅读。

如果你坚持使用相同的路线，然后在后端区分，我相信其他答案会让你回答你的问题。

找出提交的html表单

4 个答案: