[心得]jQuery blur事件擴充

看板Ajax作者TonyQ (沉默是金)時間17年前 (2008/09/18 15:07)推噓0(0推 0噓 12→)

留言12則, 2人參與討論串1/2 (看更多)

blur基本上是失焦也就是原本a物品是focus的狀態 , 接著任意b物品變成focus() a被移除focus狀態時 , 就會呼叫blur. 但是這個event我反覆測來測去 , 只有input跟select還有textarea是會有blur行為. 理由是只有這些元素 , 是點擊時會觸發 focus(). 舉例 ,像 div 就沒有 focus的狀態. 但這樣就會造成我們實做一些自訂元件的困擾 , 比方說想拿 div 模擬 select 項目 . （理由可能是外框跟選項內容可以有更大的彈性.） ────────────────────────────────── 我簡單寫了一個 eBlur() (e只是為了跟原本的blur作區隔) 以 click / focus 兩個事件偽裝成focus 的狀態 , 而以body被click跟使用者按下tab鍵當作是 blur() 的進入點. 節錄code如後, 當然 , 這東西是不能透過bind綁定的 . :p ────────────────────────────────── function _blur(e){ jq("[eBlur=1]").blur(); } $(document).click(_blur).keyup( function(e){ if(e.keyCode==9){ _blur(); } } ); $.pBlur=function(elem,fn){ if($.isFunction(fn)){ var jqThis=$(elem); jqThis.bind("blur.pb",fn); /*原本就支援fn的不作*/ if(!jqThis.is(":input,select,textarea")){ var cb=function(){ jqThis.attr("eBlur","1"); }; $(elem).bind("focus.pb",cb).bind("click.pb",cb); } }else{ $(elem).blur(); } } $.fn.pBlur=function(fn){ $(this).each(function(){$.pBlur(this,fn);}); return $(this); }; -- What do you want to have ? / What do you have? 從書本中，你可以發現我的各種興趣。從ＣＤ中，你可以瞭解我所喜歡的偶像明星。或許從文字你很難以瞭解一個人，但從物品可以。 My PPolis , My past. http://ppolis.tw/user/Tony -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 220.128.219.202 ※ 編輯: TonyQ 來自: 220.128.219.202 (09/18 15:08) ※ 編輯: TonyQ 來自: 220.128.219.202 (09/18 15:09)