Javascript jquery下拉菜单运行不正常

Javascript jquery下拉菜单运行不正常,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我的下拉菜单有以下jquery代码: var active = 0; $(document).ready(function(){ jQuery("#dropmenu ul").css({display:"none"}); // For 1 Level jQuery("#dropmenu li:has(ul) a").append(''); jQuery("#dropmenu li ul a span").text(''); // For 2 Lev

我的下拉菜单有以下jquery代码:

var active = 0;

   $(document).ready(function(){
    jQuery("#dropmenu ul").css({display:"none"});
    // For 1 Level
    jQuery("#dropmenu li:has(ul) a").append('');
    jQuery("#dropmenu li ul a span").text('');
    // For 2 Level
    jQuery("#dropmenu li ul li:has(ul) a").append('');
    jQuery("#dropmenu li ul li ul a span").text('');

    jQuery("#dropmenu li").hover(function(){
    if(active != 1){
    jQuery($('.active').parent()).find("ul:first").css('display', 'none');
    jQuery(this).find("ul:first").fadeIn('fast');
    active = 1;
    }
    },
    function(){
    jQuery(this).find("ul:first").fadeOut('fast');
    jQuery($('.active').parent()).find("ul:first").fadeIn('fast');
    active = 0;
    }); });

    //ACTIVATE 
    $(document).ready(function(){
        jQuery($('.active').parent()).find("ul:first").css('display', 'block');
    });
代码要做的是检查哪个元素有一个
活动的
类,并在页面加载时显示它

HTML的外观如下所示:

<ul id="dropmenu">
    <li><a  class="active" href="index.php">home</a>
        <ul>
            <li><a href="#">Euro 2012</a></li>
            <li><a href="#">FIA Cup</a></li>
            <li><a href="#">Previous Events</a></li>
            <li><a href="#">Event 2012-2013</a></li>
            <li class="last"><a href="#">Pre Season</a></li>
        </ul>
    </li>
    <li><a href="#" >home</a></li>
    <li><a href="#">blabl</a></li>
    <li><a href="#">dropdown</a>
        <ul>
            <li><a href="#">Euro 2012</a></li>
            <li><a href="#">FIA Cup</a></li>
            <li><a href="#">Previous Events</a></li>
            <li><a href="#">Event 2012-2013</a></li>
            <li class="last"><a href="#">Pre Season</a></li>
        </ul>
    </li>
    <!-- ... -->
</ul>

现在,当页面加载时,会显示默认下拉菜单。但是,当您将鼠标悬停在其他菜单项上时,如果它们没有下拉菜单,则会显示默认菜单并隐藏。如果您快速浏览菜单项,则会继续重复动画。如何避免动画的重复,以及如何避免在菜单为空时显示默认菜单?

我要说的是,放弃这一点,寻找可以这样做的脚本,如果你只是花时间去谷歌,有很多,这里有一个有用的链接:

我个人使用这个插件制作下拉菜单:


你可以用这个插件做很多事情,只需要一点html和css的帮助就可以制作一行下拉菜单。。。该插件使用jQuery和jQuery UI进行设计,您可以根据自己的需要进行定制,如果您没有去过jQueryUI网站,请点击这里的链接:

我向您保证,有一种比这
jQuery(“dropmenu li ul li a span”)更好的方法来编写代码行。这是下拉菜单的级别,我只使用了一个级别,所以这并不重要。如果您没有使用代码,请将其删除。至少从你的问题中删除它,问题应该只有相关的代码。完成后,现在我希望有一个解决方案。我添加了一个小提琴,以便每个人都可以调试。