你的位置:首页 > Java教程

[Java教程]jquery/js实现验证聚焦,失焦


jquery实现验证聚焦,失焦方法:

我还是喜欢用jquery来实现,不管页面中多少个输入框需要实现聚焦,失焦,都公有,我常用的方法是:

遍历该页面中的input框,获取输入框中的val值,当该输入框聚焦的时候跟存放的oldValue值进行比较,如果值相同,就把该值变为空,失焦的时候,把原来存放的值再吃赋值到val上,具体代码如下:

$(function(){  $("input[class*=input]").each(function(){     var oldValue=$(this).val();        $(this).focus(function(){       if($(this).val()==oldValue){      $(this).val('');      }      })    .blur(function(){    if($(this).val()==""){      $(this).val(oldValue)      }    })     });})

 

js实现方法一:直接在input中添加

<input type="text" onfocus="if(this.value=='聚焦吧') this.value='';" onblur="if(this.value=='') this.value='聚焦吧';" value="聚焦吧" name="name">

 

js实现方法二:

html代码:

<input type="text" value="聚焦吧" id="myinput" /> 

js代码如下:

function addListener(element,e,fn){     if(element.addEventListener){       element.addEventListener(e,fn,false);     }else{       element.attachEvent("on" + e,fn);     }   }   var myinput = document.getElementById("myinput");   addListener(myinput,"click",function(){     myinput.value = "";   })   addListener(myinput,"blur",function(){     myinput.value = "聚焦吧";   })

 

当然当页面中有聚焦,失焦的时候,我还是推荐使用jquery的这种实现方式的。

 

作者:风雨后见彩虹

出处:http://www.cnblogs.com/moqiutao/

如果您觉得本文对您的学习有所帮助,请多支持与鼓励。