JavaScript密码比对功能失效求助（附HTML及JS代码）

让我帮你梳理下这段代码里的问题，几个小细节错误导致功能失效了：

• DOM方法拼写错误：你用了document.getElementID，但正确的方法名是document.getElementById（最后一个字母是小写的d，不是大写的ID）。这个拼写错误会让脚本完全无法获取到密码输入框的值，直接导致比对逻辑无法运行。

• 函数名与原生API冲突：你把验证函数命名为click，但click是浏览器DOM元素的内置事件方法，用这个名字会和原生逻辑冲突，可能导致函数无法被正确调用。建议改成更具语义的名称，比如validatePasswordMatch。

• HTML调用需同步更新：如果修改了函数名，按钮的onclick属性也要对应调整，避免调用不存在的函数。

修正后的完整代码 #

HTML部分：

<form>
  <label>
    <strong>Username</strong>
    <input type="text" name="">
  </label>
  <label>
    <strong>Password</strong>
    <input type="password" name="" id="password">
  </label>
  <label>
    <strong>Confirm Password</strong>
    <input type="password" name="" id="confirmpassword">
  </label>
  <button class="button" type="submit" id="button" onclick="validatePasswordMatch();">Submit</button>
</form>

JavaScript部分：

function validatePasswordMatch() {
  var password = document.getElementById('password').value,
      confirmpassword = document.getElementById('confirmpassword').value;
  
  if (password === "") {
    alert("Field cannot be empty.");
  } else if (password !== confirmpassword) {
    alert("Password didn't match, try again.");
    return false;
  } else {
    alert("Password Match");
  }
  return false;
}

另外给个小提示：建议用严格相等运算符===/!==代替==/!=，避免类型转换带来的潜在问题；同时也顺便修正了提示文本里的拼写错误（didnt改成didn't）。

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