用戶名、密碼驗(yàn)證
1、
jquery驗(yàn)證表單很簡(jiǎn)單的方法
現(xiàn)在網(wǎng)上有很多jquery驗(yàn)證表單的插件,但都寫的比較復(fù)雜。一般都有兩三個(gè)文件。
我今天寫一個(gè)最簡(jiǎn)單但是很實(shí)用的驗(yàn)證登錄表單的方法。
我基本上只是給大家提供一種思路。jquery插件一般也是按這個(gè)思路寫的。
大家可以按這個(gè)思路去擴(kuò)展,不過(guò)只要實(shí)用越簡(jiǎn)單越好
代碼如下
<script type="text/javascript">
//首先要加載jquery庫(kù)文件,因?yàn)檫@里只是給大家演示,所以我就不加載了。
//下面為jquery代碼
$(function(){
$("#name").blur(function(){//用戶名文本框失去焦點(diǎn)觸發(fā)驗(yàn)證事件
if(!$(this).val || !$(this).val.match(/([w]){2,15}$/))//只處驗(yàn)證不能為空并且只能為英文或者數(shù)字或者下劃線組成的2-15個(gè)字符
{
$("#nameTip").html("用戶名不能為空且只能為英文或者數(shù)字");
}
else
{
$("#nameTip").html("輸入正確");
}
});
$("#pas1").blur(function(){//用戶名文本框失去焦點(diǎn)觸發(fā)驗(yàn)證事件
if(!$(this).val || !$(this).val.match(/([w]){2,15}$/))//只處驗(yàn)證和上面一樣
{
$("#pas1").html("密碼不能為空且只能為英文或者數(shù)字");
}
else
{
$("#pas1").html("輸入正確");
}
});
$("#pas2").blur(function(){//用戶名文本框失去焦點(diǎn)觸發(fā)驗(yàn)證事件
if(!$(this).val || $(this).val() != $("#pas1").val() )//只處驗(yàn)證和上面一樣
{
$("#pas2").html("密碼為空或者和上面的密碼不致");
}
else
{
$("#pas2").html("輸入正確");
}
});
})
</script>
<form action="#">
用戶名:<input type="text" id="name" /><span id="nameTip"></span>
密碼:<input type="password" id="pas1" /><span id="pas1Tip"></span>
確認(rèn)密碼:<input type="password" id="pas2" /><span id="pas2Tip"></span>
<input type="submit" value="提交" />
</form>
只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。 | ||
![]() |
||
網(wǎng)站導(dǎo)航:
博客園
IT新聞
Chat2DB
C++博客
博問(wèn)
管理
|
||