.live、.click 和 preventDefault 的 Jquery 问题答案

【问题标题】：Jquery issues with .live, .click and preventDefault.live、.click 和 preventDefault 的 Jquery 问题
【发布时间】：2011-01-18 19:44:38
【问题描述】：

我的表格有问题。

我想使用 jquery ajax 针对数据库验证表单，但遇到了不同的问题。

$('#formsubmit').click(function(e) {
    e.preventDefault(); // this is not working, the page reloads
});

$('#formsubmit').live('click', function(e) {
    e.preventDefault(); //works, but...
    var firstname = $('#firstname').val(); // returns an empty string and ...
    firstname = document.getElementById('firstname'); //does not return anything either
    alert("$('#firstname')"); // returns [object][object] ... should'nt it be [object][html inputelement]
});

到目前为止，我无法在单击表单的提交按钮时触发 ajax 加载，因为我无法获取输入字段的值。

我在这里错过了什么吗？是否可以使用另一种方法： 1.防止页面重新加载提交点击和 2. 获取表单的所有值并通过 ajax 将它们发送到我的 php 脚本 3.等待答案并在相应的html元素中显示。

【问题讨论】：

标签： jquery html ajax forms

【解决方案1】：

问题是您正在阻止 click 事件，而不是 submit 事件，这是您想要在此处捕获的，如下所示：

$("#formid").live("submit", function(e) {
  e.preventDefault();
  $.post("myPage.php", $(this).serialize(), function(result) { 
    $("#resultContainer").html(result);
  });
});

在上面，我们在<form> 本身上使用.serialize() 来获取所有要提交的数据（来自所有成功的输入），就像正常提交一样（no JavaScript）。

另外，我无法从您的问题中看出，但请确保您的 id 属性是唯一的，例如只有一个id="firstname"，如果不是这样，你会遇到很多问题。

【讨论】：