Question

基本上我已经使用jquery事件提交了表单数据，以防止页面重新加载。现在，表格的信息没有显示？

$("#btn-ser1").click(function() {
  $("#form").submit(function() {
    alert("you are submitting" + $(this).serialize());
  });
});

<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<body>
  <form method="post" id="form">
    First Name :
    <input name="fname">Last Name :
    <input name="lname">Address :
    <input name="address">Contact No. :
    <input name="contact">Country:
    <input name="country">City:
    <input name="city">
  </form>
  <button type="button" id="btn-ser1">Serialize</button>
</body>

</html>

Answer 1

您没有提交，也没有阻止默认操作。你需要：

$("#btn-ser1").click(function () {
  // remove this event handler                                                « #1
  // $("#form").submit(function (e) {
    // prevent refresh or default action                                      « #2
    e.preventDefault();
    // change $(this) to $("#form") as you are binding it to the button, not the form.
    alert("you are submitting" + $("#form").serialize());
    // submit to the server                                                   « #3
    $.post("path/to/post", $("#form").serialize());
  // });
});

您忘记按上述方式执行#1，#2和#3。

Answer 2

您的按钮类型不正确。这仅适用于＆＃34;提交＆＃34;按钮。请改用此HTML代码段：

<button type="submit" id="btn-ser1">Serialize</button>

通过jquery发布表单不起作用

2 个答案: