通过jQuery发布表格不起作用

Question

Basically i have submitted the form data by using jquery event in order to prevent page reload. 基本上我已经通过使用jquery事件提交了表单数据，以防止页面重新加载。 Now , the informations of the form are not being displayed? 现在，表单信息没有显示？

 $("#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

You aren't submitting, neither preventing the default action. 您没有提交，也没有阻止默认操作。 You need: 你需要：

$("#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());
  // });
});

You forgot to do the #1 , #2 and #3 as mentioned. 您忘记了如上所述的#1 ， #2和#3 。

Answer 2

Your button is the incorrect type. 您的按钮类型不正确。 This only works with a "Submit" button. 这仅适用于“提交”按钮。 Use this HTML snippet instead: 请改用以下HTML代码段：

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

通过jQuery发布表格不起作用

问题描述

2 个解决方案

解决方案1
5 已采纳 2015-12-29 14:32:50

解决方案2
-1 2015-12-29 14:33:25

通过jQuery发布表格不起作用

问题描述

2 个解决方案

解决方案1 5 已采纳 2015-12-29 14:32:50

解决方案2 -1 2015-12-29 14:33:25

解决方案1
5 已采纳 2015-12-29 14:32:50

解决方案2
-1 2015-12-29 14:33:25