離開頁面時懸停狀態持續 - 忽略mouseleave

Question

我正在使用一些非常標準的JavaScript/jQuery來處理懸停元素，圖像交換，滑動div，動畫等，這並不重要。如果/當點擊一個「可靠的」鏈接元素將您帶到一個新頁面時，懸停狀態始終保持不變。

例如，如果您將鼠標懸停在某物上並點擊它（指向另一頁的鏈接），則使用後退按鈕返回頁面，點擊該元素時會出現狀態，即使您的鼠標卡住不再是元素。

您必須重新加載頁面或重新懸停元素才能重置所有內容。

$(document).ready(function() { 
    $('.mySelector').each(function() { 
     $(this).hover(enter, leave); 
    }); 

    function enter(event) { 
     // mouseenter stuff 
    }; 
    function leave(event) { 
     // mouseleave stuff 
    }; 
}); 

我似乎記得讀到這幾個星期以前，有一個非常簡單的修復，但我不能再找到。

是任何人都熟悉的一個妥善的解決辦法？

謝謝！

Answer 1

我結束了簡單的「重新設置」通過調用鼠標離開功能的懸停效果隨着窗口「卸載」...

$(window).unload(function() { 
    leave(); 
}); 

無論何時通過單擊懸停元素離開頁面，mouseleave即使鼠標仍然懸停在元素上，也會調用該函數。點擊瀏覽器的後退按鈕不再會讓你回到頁面，併產生「卡住」懸停效果。

問題已解決。

Answer 2

您無需爲此使用.each。此外，這些功能應該在.ready之外。

$(document).ready(function() { 
    $('.mySelector').hover(enter, leave); 
}); 

function enter(event) { 
    // mouseenter stuff 
} 

function leave(event) { 
    // mouseleave stuff 
} 

編輯： 如果你的變量是局部的，你可以做這樣的：

$(document).ready(function() { 
    $('.mySelector').hover(function(){ 
     // mouseenter stuff 
    }, 
    function(){ 
     // mouseleave stuff 
    }); 
});