Question

首先，这是我的代码的简化示例，它显示了问题：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <style>
            .container {
                padding: 100px;
                background-color: red;
            }

            .content {
                width: 200px;
                height: 200px;
                background-color: blue;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <div class="content">
            </div>
        </div>

        <script src="https://code.jquery.com/jquery-3.1.0.js"></script>
        <script>
            function changeContainer()
            {
                $(".container").html("<div class='content'></div>");
            }

            $(function() {
                $(".container").mouseenter(function(){
                    window.setTimeout(changeContainer,100);
                    $("body").append("enter!<br/>");                    
                });
            });
        </script>
    </body>
</html>

JSFiddle：https://jsfiddle.net/4rpv1pfa/1/

所需的行为：

当我用鼠标输入容器div时，它用ajax重新加载其内容（在示例代码中，setTimeout模拟ajax响应延迟）。

问题：

如果我用鼠标输入容器div，然后在输入内容div之前等待其内容重新加载，一切都很好但如果我快速输入内容div而不等待，则每次移动我的时候都会触发mouseenter事件鼠标在内容div中，即使我没有移出容器div。

Internet Explorer似乎不会出现此问题。它在jQuery mouseenter() documentation page中指定该事件仅存在于Internet Explorer中并且是针对其他浏览器进行模拟的，所以我认为这是它仅在Internet Explorer中工作的原因

重新加载内容时会触发jQuery mouseenter（）

0 个答案: