鼠标移动非常快时未正确捕获 Javascript 鼠标事件

Question

当我非常快速地移动鼠标时，我正在使用 JavaScript mouseover 和 mouseout 事件，这些事件不会被触发。你能告诉我问题是什么吗？

请告诉我如何解决这个问题。如果还需要什么，也请告诉我。

这里是代码

HTML

4 => qq[
    <ul id="primary">
        <li id="firstTab" onmouseover="changeSecondaryMenu('index','explore');" onmouseout="changeSecondaryMenu('explore');"><a></a></li>
        <li id="secondTab" onmouseover="changeSecondaryMenu('home','explore');" onmouseout="changeSecondaryMenu('explore');"><a></a></li>
        <li id="thirdTab" onmouseover="changeSecondaryMenu('requests','explore');" onmouseout="changeSecondaryMenu('explore');"><a></a></li>
        <li onmouseover="changeSecondaryMenu('explore','explore');"><a class="current" href="contact.pl">About Site</a></li>
    </ul>
],
);

my $primary_menu = $primary_menu{$primary_index};

my %secondary_menu = (
    1 => qq[
        <ul id="secondary" onmouseover="cancelTimeOut();" onmouseout="resetTab(event);">
            <li> <a>Summary</a> </li>
            <li> <a>Updates</a>  </li>
            <li> <a>History</a> </li>
            <li> <a>News/Stats</a> </li>
            <li> <a>Gratitude & Good Life</a> </li>
        </ul>
    ],

JavaScript

function cancelTimeOut(){
    clearTimeout(timer);
}

function resetTab(evt){
    var evt = evt || window.event; // event object
    var target = evt.target || window.event.srcElement; // event target
    var targetID = target.getAttribute("id");
    if (targetID == "secondary") {
        clearTimeout(timer);
        if(currentTab !=null){
            document.getElementById("secondary").innerHTML = tabs[currentTab];
            Rounded("ul#secondary","tr","#FFFFFF","transparent","smooth");
        }
    }
}

function changeSecondaryMenu(tab,selectedTab) {
    currentTab = selectedTab;
    clearTimeout(timer);
    document.getElementById("secondary").innerHTML = tabs[tab];
    Rounded("ul#secondary","tr","#FFFFFF","transparent","smooth");
}

Answer 1

这取决于。 Javascript 不会尝试在“帧”之间进行插值。意思是，是的，如果你移动鼠标的速度足够快，一个 mousemove 事件将在对象的一侧触发，而下一个 mousemove 事件将在另一侧触发，因此 mouseover and out 永远不会被触发，你也不会更聪明。

如果捕获这些事件绝对至关重要，那么您将不得不自己做一些工作。您可以自己挂钩 mousemove，并且对于每个事件触发，比较上次触发期间鼠标的位置和当前触发。您需要在此处进行一些几何操作，但如果由两点创建的线触及相关对象的边界框（基于每个边的 4 个比较，或者基于通过框的 X 进行 2 个比较)，然后手动触发鼠标悬停。然后鼠标移出。