如何隐藏标准alert弹窗？已自定义密码校验提示需禁用默认弹窗

如果是浏览器自带的HTML5表单验证弹窗（就是你说的自动alert那种），有两种简单方法能解决：

方法一：一行代码搞定（给表单加属性） #

直接在你的表单标签里加novalidate属性，浏览器就不会弹自带的验证框了，只留你设置的红色自定义警告：

<form novalidate>
  <!-- 这里放你的密码输入框、重复密码输入框这些元素 -->
</form>

方法二：用JS精准控制 #

如果需要更灵活，比如只针对密码输入框禁用弹窗，可以写一小段JS阻止默认验证行为：

// 阻止表单提交时的默认验证弹窗
document.querySelector('form').addEventListener('submit', function(e) {
  // 先跑你自己的自定义验证逻辑
  if (!你的自定义验证函数()) {
    e.preventDefault(); // 验证不通过就阻止默认提交和弹窗
  }
});

或者单独针对密码输入框的无效事件做处理：

// 给所有密码输入框绑定事件，阻止自带弹窗
document.querySelectorAll('input[type="password"]').forEach(input => {
  input.addEventListener('invalid', function(e) {
    e.preventDefault();
    // 这里可以触发你的红色警告显示
  });
});

额外提醒 #

要是这个自动弹窗是其他脚本里的alert()代码触发的，那直接找到对应的alert()调用，删掉或者注释掉就行。记得确保你的自定义红色警告能正常工作，替代原来的弹窗提示。

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