當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JS-表单验证二
3.范圍驗證:年齡范圍驗證:
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無標題文檔</title><style type="text/css"></style> </head><body><form action="aa.html" method="post"> <!--<form> 中的兩個必要屬性:action,method-->年齡:<input type="text" name="nl" id="nl" /><input type="submit" value="登陸" id="b1" οnclick= "return yz()" /> <!--onclick屬性添加點擊事件--></form> </body><script type="text/javascript">function yz() //封裝一個<body>中做成點擊事件的函數 {var nl = document.getElementById("nl").value; //通過id名 找到 元素并重新 賦值if(nl<18) //判斷條件 {alert("你太年輕了!") return false;}else if(nl>60) //判斷條件 {alert("您已經老了,可以去跳廣場舞了!");return false;} else{return true; //滿足條件時將執行表單的action }}</script>不滿足條件的提示如下:
?????
4.正則驗證:郵箱驗證:
?
下面的代碼檢查輸入的數據是否符合電子郵件地址的基本語法。
?
意思就是說,輸入的數據必須包含 @ 符號和點號(.)。同時,@ 不可以是郵件地址的首字符,并且 @ 之后需有至少一個點號:
</head><body><form action="aa.html" method="post"> 郵箱:<input type="text" name="yx" id="yx" /><input type="submit" value="登陸" id="b1" οnclick= "return yz()" /> </form> </body><script type="text/javascript">function yz() //封裝一個<body>中做成點擊事件的函數 {var yx = document.getElementById("yx").value; //通過id名 找到 元素并重新 賦值var gf = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; //郵箱的正則驗證,記不住找百度if(yx=="" || null){alert("郵箱不能為空!");return false; }else if(yx.match(gf)==null) //不是很明白這個函數的意思 {alert("您輸入的郵箱地址不符合規范,請核對后再輸入!");return false; }else{return true; //滿足條件時將執行表單的action }}</script> </html>輸入不當時輸出的提示為:
附:1.JavaScript match() 方法
?
定義和用法
?
match() 方法可在字符串內檢索指定的值,或找到一個或多個正則表達式的匹配,它返回指定的值,而不是字符串的位置。
例如:
<script type="text/javascript">var str="1 plus 2 equal 3" document.write(str.match(/\d+/g))</script>輸出:
1,2,32.正則表達式:
正則表達式(regular expression)描述了一種字符串匹配的模式(pattern),可以用來檢查一個串是否含有某種子串、將匹配的子串替換或者從某個
串中取出符合某個條件的子串等
構造正則表達式的方法和創建數學表達式的方法一樣。也就是用多種元字符與運算符可以將小的表達式結合在一起來創建更大的表達式。正則表達式的組件可以是單個的字符、字符集合、字符范圍、字符間的選擇或者所有這些組件的任意組合。
正則表達式是由普通字符(例如字符 a 到 z)以及特殊字符(稱為"元字符")組成的文字模式。模式描述在搜索文本時要匹配的一個或多個字符串。正則表達式作為一個模板,將某個字符模式與所搜索的字符串進行匹配。
?
轉載于:https://www.cnblogs.com/davis16/p/7745128.html
總結
- 上一篇: 跨站请求伪造(CSRF)-简述
- 下一篇: 大话Django之一:安装与启动