Question

我正在使用Javascript尝试一个简单的下拉菜单，但是当我将鼠标悬停在应该显示我的下拉菜单的链接上时，没有任何反应。您认为我的Javascript有什么问题？

使用Javascript：

function onHover( divID )
    {
        var div = document.getElementByID( divID );

        if (div)
        {
            div.className = "unHidden";
        }
    }

    function onLeave( divID ) 
    {
        var div = document.getElementByID( divID );

        if (div)
        {
            div.className = "hidden";
        }
    }

我的css：

.hidden { visibility: hidden; }
.unHidden { visibility: visible; z-index: 30; }

最后我的HTML：

<li>
<a onmouseover="onHover('otherLinks)" onmouseout="onLeave('otherLinks')">Other Links</a>
<div class="hidden" id="otherLinks" onmouseover="onHover('otherLinks)" onmouseout="onLeave('otherLinks')">
    <ul>
    <li><a href="events.html">Events</a></li>
    <li><a href="foodNutrition.html">Food & Nutrition</a></li>
    <li><a href="faq.html">FAQ</a></li>
    </ul>
</div>
</li>

Answer 1

你有没有理由为你的下拉菜单而不是HTML和CSS使用Javascript？

suckerfish下载的儿子是开始使用HTML和CSS下拉选项的好地方：http://htmldog.com/articles/suckerfish/dropdowns/

Answer 2

是document.getElementById( divID );，请注意它是“Id”而不是“ID”。您也缺少单引号，它应该是onmouseover="onHover('otherLinks')"。我也同意丹的回答。

Answer 3

可能是这个问题：您已经传递了像

这样的div名称

onmouseover="onHover('otherLinks)"

尝试将div名称设为

onmouseover="onHover('otherLinks')"

或尝试java script ddl

Answer 4

您只能使用css。或使用库JQuery。

下拉菜单不下降

4 个答案: