Heim > Web-Frontend > js-Tutorial > Unschärfe () verliert den Fokus und Fokus () erhält das Fokusereignis in JQuery

Unschärfe () verliert den Fokus und Fokus () erhält das Fokusereignis in JQuery

黄舟
Freigeben: 2017-06-26 14:08:26
Original
4860 Leute haben es durchsucht

Früher haben wir verschiedene Eingabeereignisse direkt in die Eingabe geschrieben. Gestern habe ich begonnen, jquery vollständig zu verwenden. Lassen Sie uns nun über meine Lernnotizen zum jquery-Focus() sprechen. Ereignis.

Für Elementfokusereignisse können wir die Fokusfunktionen von jQuery focus(), blur() verwenden.

focus(): Wird verwendet, wenn der Fokus erreicht wird, genau wie onfocus in Javascript.

Zum Beispiel:

 $("p").focus(); 或$("p").focus(fn)
Nach dem Login kopieren

Zum Beispiel: Unschärfe (): Wird verwendet, wenn der Fokus verloren geht, genau wie bei Unschärfe.

$("p").blur(); 或$("p").blur(fn)
Nach dem Login kopieren

Beispiel

<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>
Nach dem Login kopieren

Wenn mit der Maus in das Suchfeld geklickt wird, verschwindet der darin enthaltene Text.

<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>
Nach dem Login kopieren

Ein p basierend auf dem Ajax-Wert, um zu bestimmen, ob p angezeigt oder ausgeblendet werden soll

<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); 
  }
  
 });
})
  
});
Nach dem Login kopieren


Das obige ist der detaillierte Inhalt vonUnschärfe () verliert den Fokus und Fokus () erhält das Fokusereignis in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage