为什么我的一个功能在 onclick 事件中不起作用？

Question

我有一个包含密码字段和确认密码以及其他输入字段的表单。 我创建了一个调用其他函数的函数。 基本上，这个函数调用一个函数，该函数在提交我的表单之前显示确认消息，另一个函数是验证两个密码字段是否相等。

因此，显示确认消息的功能确实有效，但密码验证无效。

 function confirmarAlta(){ var result = confirm("Esta seguro que desea crear este usuario?"); if(result == false){ event.preventDefault(); } } function verificarPassword(){ var pass = document.querySelector(".password").value; var confirmPass = confirmPassword.querySelector(".confirmPassword").value; console.log(pass); console.log(confirmPass) if(pass != confirmPass){ alert("Las contraseñas no coinciden"); pass = ""; confirmPass = ""; } } function Validaciones(){ verificarPassword(); confirmarAlta(); }

 <div class="form-group"> <label>Contraseña: </label> <input type="password" class="form-control password" name="txtPassword" required> </div> <div class="form-group"> <label>Repetir Contraseña: </label> <input type="password" class="form-control confirmPassword" name="txtConfirmarPassword" required> </div> <input onclick="Validaciones()" type="submit" class="btn btn-success" value="Aceptar" name="btnAceptar">

我得到的错误是未定义确认密码。

Answer 1

 function confirmarAlta(){ var result = confirm("Esta seguro que desea crear este usuario?"); if(result == false){ event.preventDefault(); } } function verificarPassword(){ var pass = document.querySelector(".password").value; var confirmPass = document.querySelector(".confirmPassword").value; console.log(pass); console.log(confirmPass) if(pass != confirmPass){ alert("Las contraseñas no coinciden"); pass = ""; confirmPass = ""; } } function Validaciones(){ verificarPassword(); confirmarAlta(); }

 <div class="form-group"> <label>Contraseña: </label> <input type="password" class="form-control password" name="txtPassword" required> </div> <div class="form-group"> <label>Repetir Contraseña: </label> <input type="password" class="form-control confirmPassword" name="txtConfirmarPassword" required> </div> <input onclick="Validaciones()" type="submit" class="btn btn-success" value="Aceptar" name="btnAceptar">

Answer 2

当您选择确认密码输入时，您选择的是confirmPassword而不是document 。

做这个改变：

// Current
confirmPassword.querySelector(".confirmPassword").value

// Change by
document.querySelector(".confirmPassword").value

Answer 3

看起来像在行尾缺少分号......

console.log(confirmPass)

另外，密码确认失败的意图是为用户清除输入框吗？ 或者只是那些局部变量？ 您可以获取对象引用而不是这些变量中的值，然后如果这是您想要的，则重置该值。

没有其他事情会在我身上跳出来，但是是的……一定要学会使用浏览器内置的开发工具（通常你可以通过按“F12”键到达那里）。 您可以在 javascript 中设置断点并遍历代码执行以查看错误发生的位置。