jquery - 如何在不刷新整个页面的情况下提交表单

Question

我已经研究过这个问题一段时间了，我发现的所有示例始终包含文本输入字段和 php。

我创建了一个社区，其中有一个“点赞按钮”，单击一次会显示更高的数字，再次单击则会下降 -1，它就像一个魅力。但我不喜欢刷新部分，它把一切都搞乱了，而且从顶部开始。

我已经尝试了大量的 Ajax/Jquery 编码，但无法阻止“重新加载部分”。我不知道是否有任何代码可以发布，因为我从不保存任何永远无法工作的无值(value)代码。

但是，表单的开头是这样的，并包含“提交图像”:

@using (Ajax.BeginForm("Like", "Home", FormMethod.Post, null, new { id = "LikeForm" }))
{
...
<input type="image" src="../Images/star.png" name="submit" />
...
}

结果显示在附近。

所有内容都被发送到 ActionResult Like()，它将所有内容保存在数据库中。结果随后显示在 View 中。我希望这部分没有什么异常。

我再一次研究了很多例子，但没有一个对我有用，我的信息主页位于 http://api.jquery.com/和堆栈溢出。在这种情况下没有任何收获。

Answer 1

如果您之前尝试使用 jQuery 来完成此操作，我希望您的代码如下所示:

$('#LikeForm').on('submit', function() {
  // do AJAX stuff here
});

这已经足够接近了，只是缺少阻止表单仍然以传统方式提交的部分。如果您还没有尝试过，请尝试这样做:

$('#LikeForm').on('submit', function(e) {
  e.preventDefault();
  // do AJAX stuff here
});

它的作用是阻止表单元素的默认行为(即通过页面重新加载来提交自身)，并且只执行 AJAX 操作。