在jQuery中重疊多個setTimeouts

這裏新增和新增了jQuery。我搜索了一個沒有成功的問題/問題的答案，所以我來了。我有這個代碼的問題：在jQuery中重疊多個setTimeouts

<p>Hello.</p> 
<p>Good bye.</p> 
<p>Ciao!</p> 
<script> 
jQuery('p').mouseover(
    function() { 
     jQuery(this).css({backgroundColor:'red'}); 
    } 
); 
jQuery('p').mouseout(
    function() { 
     myElement = jQuery(this); 
     setTimeout(function(){ 
      color = ['red','green','blue','orange']; 
      myElement.css({backgroundColor:color[Math.round(Math.random()*3)]}); 
     }, 1000 
     ) 
    } 
); 
</script>

的事情是，如果我們在過去的setTimeout函數之前，一個新的段落將光標移動已經被執行，那麼第一和第二setTimeout的功能將在行動最後受影響的段落。例如：

a）將光標移到/移出段落。 b）將光標移到/移出不同的段落。現在setTimeout函數

myElement.css({backgroundColor:color[Math.round(Math.random()*3)]});

將選擇兩次連續第二個段落的背景顏色，並沒有爲第一個。我試圖將兩個不同的變量（myElementOne和myElementTwo）與jQuery（this）值關聯起來，但無濟於事。我將非常感謝一些幫助。謝謝。

來源

2012-06-18 metaedro

勇可以使用'懸停（）'方法：http://jsbin.com/eciqiw/edit#javascript,html,live –

問題是您的myElement變量在global scope中定義，並且每個mouseout執行都會覆蓋它的前一個值。

如果用var myElement = jQuery(this);定義myElement，myElement將被定義只有在當前mouseout事件的範圍 - 而且將影響超時回調只是元素。

來源

2012-06-18 22:20:40

嗯，當然，你說得對。這是我第一次在這個網站上發帖，真的不知道是否認爲回覆只是爲了說謝謝，好，謝謝。我真的很感謝你的幫助:) – metaedro

@metaedro：你非常歡迎！ :) –

我看到它的方式，myElement成爲全球性的，只在任何時候指一個div。在它前面加上var，以便及時引用特定的this。

jQuery('p').mouseout(
    function() { 
     var myElement = jQuery(this); 
     ...

Demo

來源

2012-06-18 22:21:04

在jQuery中重疊多個setTimeouts

回答

相關問題