Question

对于我的生活，我无法弄清楚我做错了什么。当有人尝试输入下面不匹配的密码时，我想要弹出一条消息是表单代码。

function passcheck() {
  var p1 = _("pass1").value;
  var p2 = _("pass2").value;
  if (p1 != p2) {
    status.innerHTML = "Your passwords don't match";
  }
}

<form name="signupform" id="signupform" onSubmit="return false;"><div id="password">Create Password:</div>
  <input id="pass1" type="password" maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">
  <div id="confirm">Confirm Password:</div>
  <input id="pass2" type="password" onBlur="passcheck()" maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">

我错过了什么？

Answer 1

$("#pass2").change(function() {

  var p1 = $("#pass1").val();
  var p2 = $("#pass2").val();
  
  if (p1 ===  p2) {
     
  }
  else{  
    document.getElementById("passwordMatch").innerHTML = "Your passwords don't match";

}
});

#passwordMatch{color:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="pass1" type="password"  maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">
        <div id="confirm">Confirm Password:</div>
        <input id="pass2" type="password" maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">
        
        <div id="passwordMatch"></div>

首先，分别创建一个div来显示错误信息。你使用了“status”，这里没有使用过。

Answer 2

我删除了onFocus()，因为您没有为其提供脚本，我为document.getElementById()和p1添加了p2，以便您可以获得它们的价值

function passcheck() {
  var p1 = document.getElementById("pass1").value;
  var p2 = document.getElementById("pass2").value;
  var result = document.getElementById("status");
  if (p1 != p2) {
    result.innerHTML = "Your passwords don't match";
  }
}

<form name="signupform" id="signupform" onSubmit="return false;">
  <div id="password">Create Password:</div>
  <input id="pass1" type="password" maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">
  <div id="confirm">Confirm Password:</div>
  <input id="pass2" type="password" onBlur="passcheck()" maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">
  <p id="status"></p>
</form>

Answer 3

function passcheck() {
  var p1 = $("#pass1").val();
  var p2 = $("#pass2").val();
  if (p1 != p2) {
    status.innerHTML = "Your passwords don't match";
  }
}

由于你已经标记了Jquery，我假设你的HTML中有Jquery

在Jquery $（＆＃34;＃idoftheField＆＃34;）。val（）中获取字段的值

Answer 4

尝试这个

function passcheck() {
  var p1 = document.getElementById("p1").value;
  var p2 = document.getElementById("p2").value;
  if (p1 != p2) {
    document.getElementById("status").innerHTML = "Your passwords don't match";
  }
}

<form name="signupform" id="signupform" onSubmit="return false;">
  <div id="password">Create Password:</div>
  <input id="p1" type="password" maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">
  <div id="confirm">Confirm Password:</div>
  <input id="p2" type="password" onBlur="passcheck()" maxlength="88" placeholder="&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;&#9679;">
  
  <div id="status" style='color:red'></div>

密码确认无效

4 个答案: