📌  相关文章
📜  如何在提交类型的 javascript 中重定向到另一个页面 - Javascript (1)

📅  最后修改于: 2023-12-03 14:52:55.968000             🧑  作者: Mango

如何在提交类型的 javascript 中重定向到另一个页面 - Javascript

在Javascript中,可以使用window.location对象重定向到另一个页面。重定向操作可以通过设置window.location.href属性来完成。

以下是一个示例代码,演示如何在提交表单时重定向到另一个页面。

// 获取表单元素
const form = document.getElementById('myForm');

// 当表单提交时执行以下函数
form.addEventListener('submit', function(event) {
  // 阻止表单默认提交行为
  event.preventDefault();

  // 获取表单中需要提交的数据
  const formData = new FormData(form);

  // 使用 fetch 函数将表单数据提交到后端处理
  fetch('/submit', { 
    method: 'POST',
    body: formData 
  })
  .then(response => {
    // 处理响应数据
    if (response.ok) {
      // 如果响应成功,重定向到另一个页面
      window.location.href = '/success';
    } else {
      // 处理响应错误
      console.log('提交表单失败');
    }
  })
  .catch(error => {
    // 处理异常情况
    console.log('提交表单失败:', error);
  });
});

在上面的代码中,我们首先获取了一个表单元素,并给它添加了一个提交事件监听器。在事件监听器中,我们通过fetch函数向后端提交表单数据,并在提交成功后重定向到/success页面。如果提交失败,我们将在控制台中打印出错误消息。

这就是如何在提交类型的Javascript中重定向到另一个页面。记住,在重定向之前,一定要调用event.preventDefault()方法,阻止表单默认的提交行为。