古詩詞大全網 - 成語經典 - JS代碼完成會員登錄網頁,會員或密碼框填完後就出現提示內容:錯誤文本框邊框編變紅,且出現提示,如下:

JS代碼完成會員登錄網頁,會員或密碼框填完後就出現提示內容:錯誤文本框邊框編變紅,且出現提示,如下:

<head>

<title>無標題文檔</title>

<style>

div{

width:?500px;

margin:?50px?auto;

padding:?20px;

border:?1px?solid?#ddd;

overflow:?hidden;

}

span{

display:?block;

width:?100px;

float:?left;

text-align:?left;

margin-right:?5px;

}

i{

color:?red;

}

</style>

</head>

<body>

<div>

<p><span>用戶名</span><input?name="User"?type="text"?maxlength="16"?/></p>

<p><span>請輸入密碼</span><input?id="pwd"?type="password"?class="register-input"?onblur="checkpwd(pwd)"?/><i?id="pwd_i"></i></p>

<p><span>請再輸入壹次</span><input?id="repeatpsw"?type="password"?class="register-input"?onblur="checkrpwd(pwd,repeatpsw)"?/><i?id="repeatpsw_i"></i></p>

<input?name="Submit"?type="submit"?value="提交"?/>

</div>

</body>

<script>

function?checkpwd?(pwd){

var?infpwd=$("pwd_i"),

val?=?pwd.value;

if(!val){

infpwd.innerHTML="請輸入密碼!"

return?false;

}

if(val.length<6){

infpwd.innerHTML="請輸入不少於6位的密碼!"

return?false;

}

infpwd.innerHTML="您填寫的密碼是合法的!"

return?true;

}

function?checkrpwd(pwd,rpwd){

var?infrepwd=$("repeatpsw_i"),

pwd?=?$('pwd'),

rpwd?=?$('repeatpsw'),

val?=?rpwd.value;

if(!val){

infrepwd.innerHTML="?請輸入確認密碼!"

return?false;

}

if(pwd.value?!==?val){

infrepwd.innerHTML="?兩次輸入的密碼不壹致,請重新輸入!"

return?false;

}

infrepwd.innerHTML="?請牢記您輸入的密碼!";

return?true;

}

function?$(id){

return?document.getElementById(id);

}

</script>

</html>