HTML注册表单密码验证后，提交未跳转至results.html反而重载页面

嘿，我来帮你捋清楚这个问题——你遇到的核心问题大概率是表单的默认提交行为没被正确拦截，导致验证通过后浏览器直接刷新了页面，而不是按预期跳转到results.html。下面咱们一步步排查修复：

1. 先确认表单的基础配置 #

首先检查你的<form>标签有没有正确设置action和method属性，这是跳转的基础：

<form id="signupForm" action="results.html" method="GET">
  <!-- 你的用户名、密码等表单字段 -->
  <button type="submit">提交注册</button>
</form>

如果没写action="results.html"，浏览器会默认把表单提交到当前页面，自然就会刷新了。

2. 关键：在JS验证里阻止默认提交行为 #

你的密码验证逻辑里，必须先阻止浏览器的默认提交动作，不然哪怕验证通过，浏览器还是会自顾自刷新页面。给你个示例代码参考：

// 获取表单和相关元素
const signupForm = document.getElementById('signupForm');
const passwordInput = document.getElementById('password');
const confirmPwdInput = document.getElementById('confirmPassword');
const errorTip = document.getElementById('errorTip');

// 监听表单提交事件
signupForm.addEventListener('submit', function(e) {
  // 第一步：阻止浏览器默认的提交刷新行为！
  e.preventDefault();

  // 密码验证逻辑
  if (passwordInput.value !== confirmPwdInput.value) {
    errorTip.textContent = '密码不匹配，请重新输入';
    errorTip.style.display = 'block';
  } else {
    // 验证通过后，有两种方式实现跳转：
    // 方式1：让表单按配置正常提交（会用GET请求跳转到results.html）
    signupForm.submit();
    // 方式2：手动跳转页面（效果和方式1一致）
    // window.location.href = 'results.html';
  }
});

这里的e.preventDefault()是核心，它会打断浏览器的默认操作，让你能完全控制验证通过后的行为。之前你没加这个的话，验证通过后浏览器就直接执行默认提交刷新了，自然看不到跳转到results.html的效果。

3. 小细节检查 #

• 确认你的提交按钮是type="submit"，如果是type="button"的话，点击不会触发表单提交，不过这个概率比较低。
• 看看页面里有没有其他JS代码监听了表单的submit事件，可能会干扰你的逻辑，暂时注释掉其他JS测试下。

按上面的步骤调整后，验证通过时应该就能正常跳转到results.html啦～

内容的提问来源于stack exchange，提问作者DJ2