<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>更人性化的表單</title> <script> /* $作爲函數名僅僅是document.getElementById方法簡寫 */ function $(str) { return(document.getElementById(str)); } function check_submit() { if($("txt_user_name").value==""){alert("請填寫用戶名"); return(false);} if($("txt_user_pwd").value==""){alert("請填寫密碼"); return(false);} if($("txt_user_pwd_confirm").value==""){alert("請填寫確認密碼"); return(false);} if($("txt_user_pwd_confirm").value!=$("txt_user_pwd").value){alert("兩次輸入不一致"); return(false);} $("btn_submit").disabled=true;//對按鈕做隱藏 //return false;如果不去掉按鈕只能使用一次 } //當鼠標經過的時候 function mover() { /*event.srcElement來獲取當前激發事件的對象，也就是鼠標所移入的文本框對象。 *focus方法將焦點移至該文本框 * select選擇該文本框的內容 */ event.srcElement.focus(); event.srcElement.select(); } //當鼠標點擊的時候,自動清空文本框的內容 function mclick() { if(event.srcElement.value=="[請輸入用戶名]") event.srcElement.value=""; } //失去焦點且文本框內容爲空時設置值爲 function mblur() { if(event.srcElement.value=="") event.srcElement.value="[請輸入用戶名]"; } </script> </head> <body> <form action="" onsubmit="return check_submit();" method="get" name="register"> <fieldset> <legend>註冊</legend> 用戶名：<br/> <input id="txt_user_name" type="text" onclick="mclick();" onmousemove="mover();" onblur="mblur()" value="[請輸入用戶名]"/> <br/> 密 碼：<br/> <input id="txt_user_pwd" type="password" onmousemove="mover();" value="000000"/> <br/> 確認密碼：<br/> <input id="txt_user_pwd_confirm" type="password" onmousemove="mover();" value="000000"/> <br/> <input id="btn_submit" type="submit" value="提交"/><input type="reset" value="重置"/> </fieldset> </form> </body> </html>
JavaScript更人性化的表單
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章
JavaScript 音頻插件和圖表插件
howler音頻插件 配置項及事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <s
JavaScript中的window對象
window對象：每一個該對象代表一個瀏覽器窗口 1.常用方法如下 open("要打開的頁面文件名","打開窗口在操作系統中的名稱(任何名稱都可以)", "toolbar=?,menubar=?,