鼠标焦点离开文本框时验证的js代码



鼠标焦点离开文本框时验证的js代码本文章来给大家介绍两种当用户离开input输入框时自动验证用户输入的信息,最简单的就是js当前验证了,还还有一种是利用jquery .blur和ajax验证。

最简单的我找了一个实例利用js 的onblur
onBlur事件是光标失去焦点时发生的事件。

1.html
代码如下 复制代码
<INPUT TYPE=text NAME=text1 value=”1111ONBLUR_green” ONBLUR=”(document.bgColor=’green’)”>
<INPUT TYPE=text NAME=text2 value=”2222ONBLUR_black” ONBLUR=”(document.bgColor=’black’)”>
<INPUT TYPE=text NAME=text2 value=”3333ONBLUR_yellow” ONBLUR=”(document.bgColor=’yellow’)”>

上面是直接写在的html input中,我们可以定成函数
代码如下 复制代码
<script>
function onblurs(){
if(frm.name.value==”"){
alert(“请输入您的名字!”);
}else if(frm.funny.value==”"){
alert(“爱好不得为空哦!”);
}
}
</script>
<form name=”frm”>
<tr>
<td>你的姓名:</td>
<td><input type=”text” id=”name” onblur=”onblus()”/></td>
</tr><tr>
<td>你的爱好:</td>
<td><input type=”text” id=”funny” onblur=”onblus()”/></td>
</tr>
</form>
上面js的验证就差不多了,我们利用jquery blur进行ajax验证,下面是我工作时的个实例
html
代码如下 复制代码
<input name=”tgmo” type=”text” class=”tcinp” id=”tgmo” size=”15″/>
$(‘#tgmo’).blur(function(){
//alert($(this).val());
$.post(‘post.php?action=check’,{‘tgmo’:$(this).val()},function(data)
{
//alert(data);
if( data==0 )
{
$(‘#sy_a’).show();
$(‘#autoregister’).val(1);
}
else
{
$(‘#sy_a’).hide();
$(‘#autoregister’).val(0);
}

});
})
post.php
就是获取手机进行验证了,返回对应的数据,如我们可直接输入
echo 1;

关于jquery blur()方法
在上面我们的blur只是通过jquery直接绑定事件了,这样方便了很多,当输入域失去焦点 (blur) 时改变其颜色:
定义和用法
当元素失去焦点时发生 blur 事件。
blur() 函数触发 blur 事件,或者如果设置了 function 参数,该函数也可规定当发生 blur 事件时执行的代码。
提示:早前,blur 事件仅发生于表单元素上。在新浏览器中,该事件可用于任何元素。

http://www.111cn.net/wy/jquery/49100.htm