DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> setTimeout內不支持jquery的選擇器的解決方案
setTimeout內不支持jquery的選擇器的解決方案
編輯:關於JavaScript     

今天在寫一個js延時事件的時候發現在setTimeout這個方法裡面使用jquery的$(this)竟然不起作用,各種測試,最後得出結論是setTimeout內不支持jquery的選擇器。於是請教了一下QQ上做jquery開發的高手,馬上就把這問題解決了,在這裡記錄一下。
下面是作者做延時處理時的js代碼:

$('.dl_select dt').hover( 
  function(){ 
    clearTimeout(t3); 
    $(this).siblings('dd').css({'display':'block','cursor':'pointer'}); 
  }, 
  function(){ 
    t2=setTimeout(function(){$(this).siblings('dd').css({'display':'none'});},300); 
  } 
); 
$('.dl_select dd').hover( 
  function(){ 
    clearTimeout(t2); 
    $(this).css({'display':'block','cursor':'pointer'}); 
  }, 
  function(){ 
    t3=setTimeout(function(){$(this).css({'display':'none'});},200); 
  } 
); 

注意以上代碼中得setTimeout裡的代碼,如果這些代碼不在這個方法裡面,本身是沒有問題的,但是如上這種情況是會報錯的。至於原因,作者現在也沒有弄明白。經網友點化改成如下就沒事兒了,方法很巧妙。如下是正確的代碼:

$('.dl_select dt').hover( 
  function(){ 
    clearTimeout(t3); 
    $(this).siblings('dd').css({'display':'block','cursor':'pointer'}); 
  }, 
  function(){ 
    var $this=$(this).siblings('dd'); 
    t2=setTimeout(function(){$this.css({'display':'none'});},300); 
  } 
); 
$('.dl_select dd').hover( 
  function(){ 
    clearTimeout(t2); 
    $(this).css({'display':'block','cursor':'pointer'}); 
  }, 
  function(){ 
    var $this=$(this); 
    t3=setTimeout(function(){$this.css({'display':'none'});},200); 
  } 
); 

以上所述就是本文的全部內容了,希望大家能夠喜歡。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved