有人可以向我解釋爲什麼我得到這個堆棧溢出？

Updated (Fixed) Fiddle Here 有人可以向我解釋爲什麼我得到這個堆棧溢出？

Uncaught RangeError: Maximum call stack size exceeded

這是一個簡單的自定義標題鼠標放在元素時顯示。它在幾次顯示之後斷開。

function showtitle(title) { 

    $('.button').bind('mousemove', function(e){ 
    $('.message').fadeIn(600); 
    var message = $('.message').css({ 
     'position' : 'absolute', 
     'left' : e.pageX, 
     'top' : e.pageY + 25 
    }); 
    var print = title; 
    $('.message').html('<span>' + print + '</span>'); 

    }); 

} 
function hidetitle() { 
    $('.message').hide(); 
}

來源

2013-09-28 Gary Hayes

嘗試僅使用CSS來完成此操作，切換一個類並使用CSS3轉換。 – elclanrs

如果您確實需要使用JS，請使用mouseenter事件，而不是鼠標懸停。你用這個殺死js引擎。 –

您正在重新綁定mousemove事件，每當鼠標移動到元素上時，卻從未脫下它。

function moveHandler(e) { 
    $('.message').fadeIn(600); 

    var message = $('.message').css({ 
     position: 'absolute', 
     left: e.pageX, 
     top: e.pageY + 25 
    }); 

    $('.message').empty().append($('<span>', {text: title})); 
} 

function showtitle(title) { 
    $('.button').bind('mousemove', moveHandler); 
} 

function hidetitle() { 
    $('.message').hide(); 
    $('.button').unbind('mousemove', moveHandler); 
}

你也可以保持對所有的時間mousemove事件並使用CSS的:hover顯示和隱藏工具提示。

我猜這不是因爲瀏覽器的事件循環，而是因爲jQuery處理事件或jQuery的動畫排隊。你也應該褪去一次，showtitle，並在同一時間設置其文本;不是每次鼠標移動。

來源

2013-09-28 22:36:05 Ryan

謝謝先生。我仍然抓住聽衆。這工作很好。 –

這可能是因爲您將mousemove綁定到匿名函數。每次事件觸發時，函數都會再次創建。嘗試在綁定到事件之前定義該函數。

來源

2013-09-28 22:37:12 eoconnell

這是不正確的。他具有匿名，真實的約束力，但真正的原因是每次鼠標移動時他都會綁定匿名，最終導致每個鼠標懸停超過數十個事件處理程序，最終導致調用堆棧溢出。 – Kiruse

明白了。謝謝。 – eoconnell

感謝Derija93的信息。 –

有人可以向我解釋爲什麼我得到這個堆棧溢出？

回答

相關問題