javascript setCustomValidityが機能しない

私はJavascriptを使い慣れていないので、2回入力するパスワードがJavascriptを使って一致しているかどうかを確認したいと思います。私はjavascript setCustomValidityが機能しない

<html> 
<head> 
<script> 
function checkpasswd(){ 
    var p1 = document.getElementById("password1"); 
    var p2 = document.getElementById("password2"); 
    var result = document.getElementById("result"); 
    if(p1.value != p2.value){ 
     result.innerHTML = "passwd don't match"; 
     p2.setCustomValidity("passwd don't match"); 
    }else{ 
     result.innerHTML = "passwd match"; 
     p2.setCustomValidity(""); 
    } 
} 
</script> 
</head> 

<body> 
    <form> 
    passwd:<input type="password" name="password1" id="password1"> 
    confirm passwd:<input type="password" name="password2" id="password2" onkeyup="checkpasswd()"> 
    </form> 

    <div id="result"></div> 
</body> 
</html>

出典

2016-04-19 Tee

[開発コンソール]（https://developer.mozilla.org/en-US/docs/Web/API/Console）を使用する場合、これらの問題は比較的簡単にデバッグできます。 – ManoDestra

使用のdocument.getElementById（）を、右IDを使用します。しかし、動作しませんようですIDの名前uは、要素のスペルが間違っていることを見つけるために使用しています。要素を取得するには、正しいIDを指定する必要があります。

ドキュメントオブジェクトを使用することを忘れて、直接getElementByIdにアクセスしようとしました。

<html> 
<head> 
<script> 
function checkpasswd(){ 
    var p1 = document.getElementById("password1"); 
    var p2 = document.getElementById("password2"); 
    if(p1.value !== p2.value){ 
     p2.setCustomValidity("passwd don't match"); 
    }else{ 
     p2.setCustomValidity(""); 
    } 
} 
</script> 
</head> 

<body> 
    <form> 
    passwd:<input type="password" name="password1" id="password1"> 
    confirm passwd:<input type="password" name="password2" id="password2" onchange="checkpasswd()"> 
    </form> 
</body> 
</html>

出典

2016-04-19 13:47:19 Bikee

idはタイプミスですが、私はonchangeイベントを使用していないと思います – Tee

：

<html> 
<head> 
<script> 
function checkpasswd(){ 
    var p1 = getElementById("password1"); 
    var p2 = getElementById("password2"); 
    if(p1.value != p2.value){ 
     p2.setCustomValidity("passwd don't match"); 
    }else{ 
     p2.setCustomValidity(""); 
    } 
} 
</script> 
</head> 

<body> 
    <form> 
    passwd:<input type="password" name="password1" id="password1"> 
    confirm passwd:<input type="password" name="password2" id="password2" onchange="checkpasswd()"> 
    </form> 
</body> 
</html>

出典

2016-04-19 13:50:57

setCustomValidity関数は何をしますか？役に立たないようです、あなたはそれを説明できますか？ – Tee

をあなたのコードを編集した

function checkpasswd(){ 
    var p1 = document.getElementById("password1"); 
    var p2 = document.getElementById("password2"); 
    if(p1.value != p2.value){ 
     p2.setCustomValidity("passwd don't match"); 
    }else{ 
     p2.setCustomValidity(""); 
    } 
}

出典

2016-04-19 13:55:27

javascript setCustomValidityが機能しない

答えて

関連する問題