Detailed explanation on the use of blur and focus events in jQuery-JS Tutorial-php.cn

Detailed explanation on the use of blur and focus events in jQuery

黄舟

Release： 2017-06-26 14:06:12

Original

1750 people have browsed it

This article mainly introduces the application of focus and blur events in jQuery. Friends in need can come and refer to it. I hope it will be helpful to everyone

1. Reasons for demand
When filling in the form, the following effects need to be achieved

2. Specific implementation

<!DOCTYPE html PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<
head
>
<meta http-equiv="Content-Type"content="text/html; charset=UTF-8">
<title>鼠标点击后无文字，挪开鼠标后有文字</title>
<script 
lang
uage="
JavaScript
"src="../jQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
     $(function(){
         /*进入焦点时触发*/
         $("#ac
count
").focus(function(){
              varoldValue = $(this).val();
              if(oldValue == this.defaultValue){
                  $(this).val("");
              }
         });  
         /*失去焦点时触发*/
         $("#account").blur(function(){
              alert("12");
              varoldValue = $(this).val();
              if(oldValue == ""){
                   $(this).val(this.defaultValue);
              }
         });
     });
</script>
</head>
<body>
帐号：<input id="account"name="account" type="text" value="请输入帐号">
</body>
</html>

Copy after login

The above is the detailed content of Detailed explanation on the use of blur and focus events in jQuery. For more information, please follow other related articles on the PHP Chinese website!