javascript - 如何检测是否不是onmouseover?

时间:2012-09-05 05:59:01

标签: javascript html events dom onmouseover

我有一个脚本,使用onmouseover

使元素display = block
<script language="JavaScript">
function aaa() 
{
    document.getElementById('cat').style.display = "block";
}
</script>

<a href='#' onmouseover='aaa()'>hover on me</a>

<div  id='cat' style='display:none;'>this will show</div>

当鼠标悬停在

上时,我想将该元素返回到原始显示属性(无)
"<a href='#' onmouseover='aaa()'>hover on me</a>"

我该怎么做?

5 个答案:

答案 0 :(得分:5)

onmouseout事件

function bbb() 
{
    document.getElementById('cat').style.display = "none";
}

...

<a href='#' onmouseover='aaa()' onmouseout='bbb()'>hover on me</a>

答案 1 :(得分:3)

演示:http://jsfiddle.net/TRxRV/1/

HTML:

<a href='#' onmouseover='show();' onmouseout='hide();'>hover</a>
<div  id='cat' style='display:none;'>cat</div>​

JavaScript的:

window.show = function () {
    document.getElementById('cat').style.display = "block";
}

window.hide = function () {
    document.getElementById('cat').style.display = "none";
}

答案 2 :(得分:3)

这可以帮助您......

                function aaa()
                {
                    document.getElementById('cat').style.display = "block";
                }
                function bbb()
                {
                    document.getElementById('cat').style.display = "none";
                }

        <a href='#' onmouseover='aaa()' onmouseout="bbb();">hover on me</a>
        <div id='cat' style='display: none;'>this will show</div>

答案 3 :(得分:3)

我正在考虑你提供的相同代码作为示例。如果您在onMouseout()函数中包含原始显示属性,则当鼠标未结束时,U将返回原始属性。

<script language="JavaScript">
function aaa() 
{
    document.getElementById('cat').style.display = "block";
}
function bbb()
{
//include the code TO CHAGE THE PROPERTY HERE
document.getElementById('cat').style.display = "      ";
}
</script>

<a href='#' onmouseover='aaa();' onmouseout="bbb();">hover on me</a>

<div  id='cat' style='display:none;'>this will show</div>

答案 4 :(得分:2)

您应该使用onMouseOut事件,代码看起来像

<a href='#' onmouseover='show();' onmouseout='dontShow();'>hover</a>
<div  id='cat' style='display:none;'>this will show</div>​



function show() {
    document.getElementById('cat').style.display = "block";
}

function dontShow() {
    document.getElementById('cat').style.display = "none";
}