在传统的HTML表单中,当用户提交表单时,页面会发生整体刷新,然后跳转到表单的目标URL。而使用Ajax进行表单提交时,默认情况下是不会发生页面整体刷新的,因为Ajax是通过异步请求将数据发送到服务器,并在不刷新页面的情况下获取和处理响应。

但是,你可以通过以下方法使Ajax表单提交后,页面跳转到目标URL:

  1. 在Ajax请求的成功回调函数中,使用window.location.href将页面重定向到目标URL。例如:
$.ajax({
  url: "your-target-url",
  type: "POST",
  data: yourFormData,
  success: function(response) {
    // 处理成功响应
    window.location.href = "your-redirect-url";
  },
  error: function(xhr, status, error) {
    // 处理错误响应
  }
});
  1. 在服务器端返回响应时,可以将目标URL作为响应数据返回给前端,然后在Ajax请求的成功回调函数中使用window.location.href重定向到目标URL。例如:

服务器端代码(示例为Node.js):

app.post("/your-target-url", function(req, res) {
  // 处理表单提交逻辑
  // ...

  // 返回目标URL
  res.send("your-redirect-url");
});

前端代码:

$.ajax({
  url: "your-target-url",
  type: "POST",
  data: yourFormData,
  success: function(response) {
    // 重定向到目标URL
    window.location.href = response;
  },
  error: function(xhr, status, error) {
    // 处理错误响应
  }
});

这样,当Ajax请求成功后,页面将会跳转到目标URL。

ajax如何像普通表单一样跳转过去?

原文地址: http://www.cveoy.top/t/topic/i29u 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录