JQuery меню сценария. скрыть () не работает - PullRequest
1 голос
/ 07 июля 2011

Я пытаюсь написать скрипт о меню jquery. Моя проблема в том, что функция jquery hide () не работает. Мой код:

<head>
<script type="text/javascript">
    $(document).ready(function(){
        $('#topmenu ul li').mouseover(function(){ 
            $('#topmenu ul li').removeClass('show');
            $('.child').hide();
            $(this).addClass('show');
            var currentTab = $(this).attr('id').replace("parent", "#child");
            $(currentTab).addClass('showtab');
            $(currentTab).show();
            return false;
        });
        $('#topmenu ul li').mouseout(function(){
            var currentParent = $(this).attr('id').replace("parent", "#parent");
            var currentTab = $(this).attr('id').replace("parent", "#child");
            $(currentTab).hide(); <---- this not works
            if ($(currentTab).hasClass('showtab')) {
                $(currentTab).show();
                $(currentTab).mouseout(function(){
                    /*alert($(this).height());*/
                    $(this).removeClass('showtab');
                    $(currentParent).removeClass('show');
                    $(this).hide();
                });
            }

            return false;
        });

    });
</script>
</head>


<div class="wrapper">
    <div id="topmenu">
        <ul>
            <li id="parent1" class="parent first">First</li>
            <li id="parent2" class="parent">second</li>
            <li id="parent3" class="parent">third</li>
            <li id="parent4" class="parent">fourth</li>
            <li id="parent5" class="parent">fift</li>
            <li id="parent6" class="parent last">sixt</li>
        </ul>
        <div id="child1" class="child">
                blah blah blah 1        
        </div>
        <div id="child2" class="child">
                blah blah blah 2                            
        </div>
        <div id="child3" class="child">
                blah blah blah 3
        </div>
        <div id="child4" class="child">
                blah blah blah 4
        </div>
        <div id="child5" class="child">
                blah blah blah 5    
        </div>
        <div id="child6" class="child">
                blah blah blah 6
        </div>
    </div>  
</div>

Ответы [ 2 ]

1 голос
/ 07 июля 2011

.hide работает нормально, но только двумя строками позже (внутри if) вы неизбежно show снова.

Весь блок if ($(currentTab).hasClass('showtab')) { очень запутан.Что это должно делать?Повторное назначение другого mouseover без удаления - плохая вещь.Через некоторое время вкладкам будут назначены десятки обработчиков.

Когда вы оставите весь блок if, он будет работать нормально.

0 голосов
/ 07 июля 2011

Хорошо.Вы нигде не загружаете jquery.

<script src="jquery.js"></script>

Кажется, что работает нормально, когда вы действительно загружаете библиотеку.:)

...