【javaweb】JS簡單的註冊頁面資料校驗
阿新 • • 發佈:2018-11-21
今天剛學JavaScript,利用JS對註冊頁面的輸入資料進行簡單的檢驗,還是有些不太懂的地方,記錄一下。
上原始碼:
<html> <head> <meta charset="UTF-8"> <title></title> <!-- 1.校驗使用者名稱, 長度不能小於6位 1.確定事件: 提交事件 onsubmit 2.事件要觸發函式 checkForm() 3. 函式中要去做一些校驗 --> <script> function checkForm(){ //獲取使用者輸入的內容 var input1 = document.getElementById("username"); //alert(input1.value); var uValue = input1.value; if(input1.value.length >= 6){ }else{ 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("校驗成功"); }else{ alert("校驗失敗") return false; } return true;; } </script> </head> <body> <form action="../01-網站首頁的優化/網站首頁.html" 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 DOM物件不熟系,希望接下來幾天多看下文件(http://www.w3school.com.cn/jsref/dom_obj_event.asp)。