JS悬停链接调用函数，但是只有一次？

Question

我有一个简单的HTML页面，其中包含许多链接。

当链接悬停时，它会调用函数dothis()来更改页面上div的内容，但无论它悬停了多少次，我都只希望它为每个链接运行一次该函数。

例如，如果用户将鼠标悬停在特定链接上，将鼠标移开并再次悬停，它将不会再次加载该功能（每个链接都具有此1悬停限制，因此用户可以将鼠标悬停在链接A上，然后链接B仍然可以悬停时运行该函数（但每个链接仅运行一次）。

我已经加载了jquery，如果这使事情变得更容易。

有什么想法可以做到吗？

Answer 1

采用

.one()

jQuery API 。

说明：将处理程序附加到元素的事件。 该处理程序每个元素最多执行一次。

Answer 2

您可以在mouseenter上使用unbind

$("#elementID").mouseenter(function(e){
$(this).unbind(mouseenter);
});

或one

$("#elementID").one("mouseenter",function(){
//do something
});

Answer 3

这是我的处理方式：

当用户将鼠标悬停在链接上时，函数将检查内部变量。 如果为null，则该函数将设置内部变量，以便它不会多次调用dothis（）函数。

<!DOCTYPE html>
<html>
    <head>
        <title>Hover Once</title>
    </head>
    <body>


        <a href="#" onmouseover="onHover(this)">Link 1</a>
        <a href="#" onmouseover="onHover(this)">Link 2</a>
        <a href="#" onmouseover="onHover(this)">Link 3</a>

        <script>

            function onHover(element) {

                if(element.alreadyHovered == null) {
                    console.log("call dothis()");
                    element.alreadyHovered = true;
                }

            }

            </script>

    </body>
</html>

JS悬停链接调用函数，但是只有一次？

问题描述

3 个解决方案

解决方案1
4 已采纳 2011-12-31 19:52:13

解决方案2
2 2011-12-31 19:52:33

解决方案3
1 2011-12-31 19:55:11

JS悬停链接调用函数，但是只有一次？

问题描述

3 个解决方案

解决方案1 4 已采纳 2011-12-31 19:52:13

解决方案2 2 2011-12-31 19:52:33

解决方案3 1 2011-12-31 19:55:11

解决方案1
4 已采纳 2011-12-31 19:52:13

解决方案2
2 2011-12-31 19:52:33

解决方案3
1 2011-12-31 19:55:11