javascript password match if not match show in innerHTML

Question

hi you write that code that is helpful for me but i want to show message in innerHTML when password not match how to do this i am trying but not working for me.below is my code .please guide me. i am beginner learner.

                if (pwd != cpwd) {

                 document.getElementById("pwd").innerHTML="password must be match";
     document.getElementById("cpwd").innerHTML="password must be match";
     document.getElementById("pwd").style.color="RED";

      return false;

}

i want to know about how to exactly write in innerHTML

below your code

               <input id="pass1" type="password" placeholder="Password" style="border-radius:7px; border:2px solid #dadada;" /> <br />
               <input id="pass2" type="password" placeholder="Confirm Password" style="border-radius:7px; border:2px solid #dadada;"/> <br />

 <script>
function myFunction() {
    var pass1 = document.getElementById("pass1").value;
    var pass2 = document.getElementById("pass2").value;
    if (pass1 != pass2) {
        //alert("Passwords Do not match");
        document.getElementById("pass1").style.borderColor = "#E34234";
        document.getElementById("pass2").style.borderColor = "#E34234";
    }
    else {
        alert("Passwords Match!!!");
    }
}

Sumbit

Thanks for advance waiting for your appreciate answer.

Answer 1

You should use the event onBlur tied to the field "pass2" in order trigger the first code snippet attached to your question.

For example:

document.getElementById("pass2").onblur=function(){
    var pass1 = document.getElementById("pass1").value;
    var pass2 = document.getElementById("pass2").value;
    if (pass1 != pass2) {
      document.getElementById("pass1").innerHTML="password must be match";
      document.getElementById("pass2").innerHTML="password must be match";
      document.getElementById("pass1").style.color="RED";
      return false;
     }
     return true;    
};

Another option is to tie it to the submit button.

Answer 2

添加一个div来存储对<div id='validate'></div>类的文档的密码验证响应，然后在检查密码是否匹配后，可以在此div document.getElementById('validate').innerHTML="passwords do not match!";的html中显示适当的结果.getElementById document.getElementById('validate').innerHTML="passwords do not match!";