Question

首先，这是有问题的代码行：

<a onmouseover="hoverDisplay(this)" onmouseout="setTimeout(unHoverDisplay(), 3000);" href="http://rabbit.jpg">
            Rabbit
        </a><br>

基本上，我希望图片加载并在我将鼠标悬停在链接上时显示，并且当我将鼠标悬停在链接之外时，我希望它在一段时间后消失。方法：

hoverDisplay(this)
unHoverDisplay()

分别显示和删除图像，但是当我试图延迟unHoverDisplay（）时，它没有工作;当我的鼠标从链接上徘徊时，图像消失了。

我已经尝试在setTimeout之后添加和删除分号（不确定分号是否有必要），我也尝试延迟hoverDisplay函数，但这不起作用。除了延迟问题，这两个函数按预期工作。

这似乎是一个简单的问题，但我无法弄清楚我做错了什么。感谢帮助。感谢。

不确定是否有必要，但以下是两个函数的实现：

//Display image for link that you hover over
            var address; //Address of image
            var toBeDisplayed; //Declaring img object
            var maxHeight=screen.height;
            var maxWidth=screen.width;
            var invisible=document.getElementById("invisible"); //the div in which the image is contained

            function hoverDisplay(imageLink)
            {
                address=imageLink.getAttribute("href"); //get address

                toBeDisplayed=document.createElement("img"); //create img                           
                toBeDisplayed.setAttribute("src", address); //give img the address

                //Resize img if it doesnt fit on the screen
                if(toBeDisplayed.height > maxHeight)
                {
                    toBeDisplayed.style.height="" + maxHeight + "px";
                }
                else if(toBeDisplayed.width > maxWidth)
                {
                    toBeDisplayed.style.width="" + maxWidth + "px";
                }

                invisible.appendChild(toBeDisplayed); //display image by adding it as a child to a div
                invisible.style.visibility="visible"; //make div visible
                toBeDisplayed.style.border="solid yellow 5px";

            }
            //Remove image once you hover out of the link
            function unHoverDisplay()
            {
                //Removes all children of the div
                while(invisible.firstChild)
                {
                    invisible.removeChild(invisible.firstChild); //remove img by removing it as a child
                }
                invisible.style.visibility="hidden";
            }

Answer 1

麻烦的是，在setTimeout的第一个参数中unHoverDisplay之后的括号会导致unHoverDisplay立即执行。您只想通过其标识符传递函数而不使用括号：

onmouseout="setTimeout(unHoverDisplay, 3000);"

Answer 2

您正在将函数作为参数传递给setTimeout，而不是调用它。因此，您不需要这些括号和函数名称，所需的只是函数名称本身。

onmouseout =“setTimeout（unHoverDisplay，3000）;”

setTimeout不能与onmouseout一起使用

2 个答案: