jquery小錯誤

我很新的jQuery和代碼，這裏我試圖讓setTimeout事件在.mouseout事件中，但我不知道如何做到這一點，因爲我一直在我的編輯器中出現語法錯誤。下面是我有：jquery小錯誤

 
jQuery(document).ready(function() { 
    $('.slidedown').hide(); 
    $('.trigger').hover(function(){ // enter animation 

    $('.slidedown').stop(true,true).animate({ 
     height: ['toggle', 'swing'], 
     }, 600, function() { /* animation done */ }); 

    }, function(){ // leave animation 


$('.slidedown').mouseout() 
    setTimeout(function(){ 
     $('.slidedown').stop(true,true).animate({ 
     height: '0px', 
     }, 600, function() { /* animation done */ }); 
    }, 1000); 

    }); 
});

一個小的細微差別，在這段代碼在一個div用戶移動鼠標，然後又格婁它滑下。將鼠標移動到.slidedown div應保持打開狀態，直到刪除鼠標。但是，如果用戶在.trigger之後沒有將鼠標懸停在.slidedown上，而是將鼠標從.trigger直接移動到頁面的另一個區域，該代碼是否會摺疊.slidedown div？也就是說，我需要某種'setTimeout'，只有當鼠標懸停在.trigger之後，用戶不會將鼠標移到.slidedown時才觸發。希望我有道理。謝謝你的幫助！

來源

2011-01-07 HeinekenBluess

** Off-topic **，但看那些懸掛的逗號就像你的'height：`行後面的那個），IE7和更早的版本會扼殺它們：http://blog.niftysnippets.org/2010/09/literal-improvement.html – 2011-01-07 08:59:51

減少主題：小心使用`mouseout `，它在父類元素上觸發，因爲它移動了子元素（因爲它會起泡）。您可能會考慮`mouseleave`，這是IE特定的，但是由jQuery模擬（例如，您可以安全地使用它）：http：/ /api.jquery.com/mouseleave/ – 2011-01-07 09:17:14

@Crowder是正確的對象文字的最後一個屬性會窒息IE7和低於 – Arnab 2011-01-07 09:23:19

此行是問題

$('.slidedown').mouseout()

這shoule是

$('.slidedown').mouseout(YOUR_CALLBACK_FUNCTION)

你應該通過一個回調函數將作爲事件處理程序和事件處理中可以調用的setTimeout（）你這樣做的方式。

所以正確的代碼應該是這樣的

$('.slidedown').mouseout(function() { 
    setTimeout(function(){ 
     $('.slidedown').stop(true,true).animate({ 
      height: '0px', 
     }, 
     600, 
     function() { /* animation done */ } 
    ); // animate ends here 
    }, 1000); // setTimeout ends here 
}); // mouseout ends here

來源

2011-01-07 08:49:53 Arnab

感謝TJ和ARNAB，這個工程：

$(document).ready(function() { 
    $('.slidedown').hide(); 
    $('.trigger').hover(function(){ // enter animation 

    $('.slidedown').stop(true,true).animate({ 
     height: ['toggle', 'swing'], 
     }, 600, function() { /* animation done */ }); 

    }, function(){ // leave animation 

$('.slidedown').mouseout(function() { 
    setTimeout(function(){ 
     $('.slidedown').stop(true,true).animate({ 
      height: '0px', 
     }, 
     600, 
     function() { /* animation done */ } 
    ); // animate ends here 
    }, 1000); // setTimeout ends here 
}); // mouseout ends here 
    }); 
});

但其他的事情我提到過關於移動.trigger鼠標，但隨後離開（但不能進入.slidedown）不起作用。 .slidedown只是保持開放。 :) :(我認爲這將是一個非常複雜的.mouseout事件，對於鼠標的一個目標有一種「允許」規則。

來源

2011-01-07 09:22:57 HeinekenBluess

回答

相關問題