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

Question

我已经对此进行了一段时间的研究，我发现的所有示例都包含文本输入字段和 php。

我创建了一个社区，它有一个“Like-button”，单击一次显示更大的数字，再次单击它会下降 -1，它就像一个魅力。但我不喜欢刷新部分，它把一切都搞砸了，从顶部开始。

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

但是，表单是这样开始的，并且包含“提交图像”：

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

结果显示在附近。

所有内容都发送到 ActionResult Like()，它将所有内容保存在数据库中。结果稍后会显示在视图中。我希望这部分没有什么不寻常的地方。

再一次，我查看了许多示例，但没有一个对我有用，我的信息主页位于 http://api.jquery.com/ 和 stackoverflow。在这种情况下没有任何收获。

Answer 1

如果你之前尝试过使用 jQuery，我希望你的代码看起来像这样：

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

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

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

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