實例
當輸入域失去焦點 (blur) 時改變其顏色:
$("input").blur(function(){ $("input").css("background-color","#D6D6FF");});
<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><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></html>
定義和用法
當元素失去焦點時發生 blur 事件。
blur()
函數觸發 blur 事件,或者如果設置了 function 參數,該函數也可規定當發生 blur 事件時執行的代碼。
提示:早前,blur 事件僅發生于表單元素上。在新瀏覽器中,該事件可用于任何元素。
觸發 blur 事件
觸發被選元素的 blur 事件。
語法
$(selector).blur()
<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){ $("input").focus(function(){ $("input").css("background-color","#FFFFCC"); }); $("input").blur(function(){ $("input").css("background-color","#D6D6FF"); }); $("#btn1").click(function(){ $("input").focus(); }); $("#btn2").click(function(){ $("input").blur(); }); });</script></head><body>Enter your name: <input type="text" /><p>請在上面的輸入域中點擊,使其獲得焦點,然后在輸入域外面點擊,使其失去焦點。</p><p><button id="btn1">觸發輸入域的 focus 事件</button></p><p><button id="btn2">觸發輸入域的 blur 事件</button></p></body></html>
總結
以上就是這篇文章的全部內容了,希望本文的內容對大家的學習或者工作具有一定的參考學習價值,謝謝大家對武林網的支持。如果你想了解更多相關內容請查看下面相關鏈接
新聞熱點
疑難解答