ここに私の問題があります:
私は現在、パスワードの安全性レベルを検証するための JavaScript 関数を設計しています。パスワードを入力したら、jQuery を使用して、"Your password is" という文と指定された安全レベルを含む div (デフォルトでは非表示) の表示を切り替えます。
onKeyUp event
パスワード入力で を使用して div の表示をトリガーすることを除いて、すべて正常に動作します。ただし、当然のことながら、キーを押すたびに div の表示が切り替わります。結果: パスワード入力で最初のキーを押すたびに div が表示され、次のキーを押すと再び消えます。最初のキーを押してdivを一度切り替え、次のキーを押しても消えないようにする方法はありますか?
コードは次のとおりです。
function password1Security()
{
var pwd1 = document.getElementById("password1");
var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
var pwdsft = document.getElementById("passwordSafetyLevel1");
{
if (strongRegex.test(pwd1.value))
{
pwdsft.innerHTML = '<span style="color:green;">Safe</span>'
}
else if (mediumRegex.test(pwd1.value))
{
pwdsft.innerHTML = '<span style="color:orange;">Quite Safe</span>'
}
else
{
pwdsft.innerHTML = '<span style="color:red;">Unsafe</span>'
};
}
};
<input name="password1"
id="password1"
type="password"
size="15"
maxlength="20"
style="width:500px; height:30px;"
onKeyUp="showPassSafety1()" />
<br/>
<span name="passwordSafety1"
id="passwordSafety1"
style="font-size:12pt; display:none;">Your password is <b name="passwordSafetyLevel1" id="passwordSafetyLevel1"></b>.
< /span>
<br/>