flou () perd le focus et focus () obtient un événement de focus dans jquery-js tutoriel-php.cn

flou () perd le focus et focus () obtient un événement de focus dans jquery

黄舟

Libérer： 2017-06-26 14:08:26

original

4860 Les gens l'ont consulté

Dans le passé, lorsque nous écrivions divers événements d'entrée en js, nous les écrivions directement dans l'entrée Hier, j'ai commencé à utiliser pleinement jquery. Parlons maintenant de mes notes d'étude sur jquery blur() focus(). événement.

Pour les événements de focus d'élément, nous pouvons utiliser les fonctions focus de jQuery focus(), blur().

focus() : Utilisé lorsque le focus est obtenu, le même que onfocus en javascript.

Tels que :

 $("p").focus(); 或$("p").focus(fn)

Copier après la connexion

Tels que : flou() : utilisé lorsque la mise au point est perdue, de la même manière que onflou.

$("p").blur(); 或$("p").blur(fn)

Copier après la connexion

Exemple

<script type="text/javascript">
$(document).ready(function(){
  $("input").focus(function(){
    $("input").css("background-color","#FFFFCC");
  });
  $("input").blur(function(){
    $("input").css("background-color","#D6D6FF");
  });
});
</script>
</head>
<body>
Enter your name: <input type="text" />
<p>请在上面的输入域中点击，使其获得焦点，然后在输入域外面点击，使其失去焦点。</p>
</body>

Copier après la connexion

Lorsque vous cliquez avec la souris dans le champ de recherche, le texte à l'intérieur disparaît.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>input失去焦点和获得焦点jquery焦点事件插件</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
//focusblur
    jQuery.focusblur = function(focusid) {
var focusblurid = $(focusid);
var defval = focusblurid.val();
        focusblurid.focus(function(){
var thisval = $(this).val();
if(thisval==defval){
                $(this).val("");
            }
        });
        focusblurid.blur(function(){
var thisval = $(this).val();
if(thisval==""){
                $(this).val(defval);
            }
        });
        
    };
/*下面是调用方法*/
    $.focusblur("#searchkey");
});
</script>
</head>
<body>
<form action="" method="post">
<input name="" type="text" value="输入搜索关键词" id="searchkey"/>
<input name="" type="submit" id="searchbtn" value="搜索"/>
</form>
<p>input失去焦点和获得焦点jquery焦点事件插件，<br/><strong style="color:#F00">鼠标在搜索框中点击的时候里面的文字就消失了</strong>。</p>
</body>
</html>

Copier après la connexion

Un p basé sur la valeur ajax pour déterminer s'il faut afficher ou masquer p

<tr>
    <td width=&#39;70&#39; height=&#39;30&#39; align=&#39;right&#39;><span class="red">*</span> 手机：</td>
    <td width=&#39;198&#39; align=&#39;center&#39;><input name="tgmo" type="text" class="tcinp" id="tgmo" size="15"/></td>
    <td><span class="gray">用房乐网会员登录名可获取5房乐币
</span></td>
  </tr>

js

$(function(){
 
$(&#39;#tgmo&#39;).blur(function(){
 $.post(&#39;post.php?action=check&#39;,{&#39;tgmo&#39;:$(&#39;tgmo&#39;).val()},function(data)
 {
  if( data==0 )
  {
   $(&#39;#sy_a&#39;).show();
   $(&#39;#autoregister&#39;).val(1); 
  }
  else
  {
   $(&#39;#sy_a&#39;).hide();
   $(&#39;#autoregister&#39;).val(0); 
  }
  
 });
})
  
});

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!