js--彈出對話方塊、改變控制元件內容、驗證輸入郵箱的合法性
阿新 • • 發佈:2018-11-11
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript"> function buttonAlert () { /* 彈框 */ // alert("別點我了。"); /* 改變控制元件內容 */ var pid = document.getElementById("xia"); pid.innerHTML = "<a href='#'>hello1111</a>"; } function checkForm() { var username = document.getElementById("username"); var uName = username.value; /* 校驗使用者名稱 */ if(uName.length<6) { alert("使用者名稱不能小於六位"); return false; } /* 校驗郵箱 */ var email = document.getElementById("email") var uEmail = email.value; if(!(/^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/.test(uEmail))) { alert("郵箱不匹配") return false ; } return true ; } </script> </head> <body> <input type="button" value="按鈕" onclick="buttonAlert()"/> <p id="xia">123</p> <form action="#" onsubmit="return checkForm()" > 使用者名稱:<input type="text" id="username" /><br /> 密碼:<input type="password" id="password" /><br /> 郵箱:<input type="text" id="email" /><br /> <input type="submit" value="提交" /> </form> </body> </html>