十五正则表达式
1.表单验证
减轻服务器压力
1.基本思路
获取表单元素
对数据进行判断
表单进行提交触发事件,对数据进行验证
2.实现
js οnsubmit=“return validate()”
jQuery $("*").click(function(){…})
blur() 失去焦点
focus() 得到焦点
select() 选中文本域的内容,突出显示输入区域的内容
<script language="javascript" src="../js/jquery-1.8.2.js"></script>
<script language="javascript">
//js进行验证
function validate(){
if(mf.uname.value==""||mf.uname.value.length<4){
alert("js用户名不能为空,且长度至少为 4 位!");
mf.uname.focus(); //重新获得焦点
return false;
}
if(mf.upass.value==""||mf.upass.value.length<6){
alert("js密码不能为空,且长度至少为 6 位!");
mf.upass.focus(); //重新获得焦点
return false;
}
return true;
}
//jQuery进行验证
$(function(){
$("input[name='but1']").click(function(){
var res=""; //保存错误提示信息
if($("input[name='uname']").val()==""||$("input[name='uname']").val().length<4){
res="jq用户名不能为空,且长度至少为 4 位!";
alert(res);
$("input[name='uname']").focus()
return false;
}
if($("input[name='upass']").val()==""||$("input[name='upass']").val().length<6){
res="jq密码不能为空,且长度至少为 6 位!";
alert(res);
$("input[name='upass']").focus()
return false;
}
return true;
});
});
</script>
</script>
<body>
<h2>用户登录</h2>
<!--onsubmit="return validate();" -->
<form action="ok.html" method="post" name="mf" onsubmit="return validate1()">
用户名:<input name="uname" type="text" /><br/>
密码:<input type="password" name="upass"/><br/>
<!--onclick="return validate();"-->
<input type="submit" name="but1" value="登 录" />
<input type="reset" name="but2" value="取 消"/>
</form>
</body>
2.正则表达式
一些具有特定含义字符组成的字符
优化代码,简化书写,严谨验证
1.正则表达式的模式
**1.简单模式
var reg=/表达式/
只能表示具体的匹配 例:var reg=/china/
2.函数实现
var reg=new RegExp(“pattern表达式”,“attributes附加参数”)
可以使用通配符表达更加抽象的规则模式 且/^(开头)…$/结尾
例:var reg=/^\w+@\w+.[a-zA-Z]{2,3}(.[a-zA-Z]{2,3})?$/;
2.匹配方法
exec() 检索字符中是正则表达式的匹配
test() 检索字符串中指定的值,返回true或false
3.字符匹配
通配符
\d 0-9 \D 除0-9
\w 0-9,a-z,A-Z \W 除0-9,a-z,A-Z
\s 空白字符 \S 非空白字符(默认一次)
, 所有字符(默认一次
自定义匹配符
[****]
4.次数匹配符
? 0次或1次
* 匹配0次或多次
+ 匹配0次或多次
{n} 匹配n次
{n,} 至少匹配n次
{n,m} 匹配n-m次
如不指定次数匹配符,默认出现一次
<script language="javascript" src="../js/jquery-1.8.2.js"></script>
<script language="javascript">
$(function(){
var s1="helloworldhello123 你好 hello";
var res=s1.match(/hello/g);
alert("数组的元素个数: "+res.length);
//2. 若用户名只能由数字、下划线、字母组成,且长度在 6-8 之间
$("input[name='but1']").click(function(){
var res=""; //保存错误提示信息
var $nm=$("input[name='uname']");
var reg1=/^\w{6,8}$/;
if(reg1.test($nm.val())==false){
res="用户名只能由数字、下划线、字母组成,且长度在 6-8 之间!";
alert(res);
return false;
}
return true;
});
});
</script>
<body>
<h2>用户登录</h2>
<form action="ok.html" method="post" name="mf">
用户名:<input name="uname" type="text" /><br/>
密码:<input type="password" name="upass"/><br/>
<input type="submit" name="but1" value="登 录"/>
<input type="reset" name="but2" value="取 消"/>
</form>
</body>