Нужно ли закрытие Javascript? - PullRequest
Новая
       2

Нужно ли закрытие Javascript?

0 голосов
/ 26 апреля 2011

Для приведенного ниже дополнительного кода, как лучше это сделать. Нужны ли закрытия, и если да, то как?

У меня есть левая навигация, и при наведении курсора мыши мне нужно отобразить содержимое страницы. У меня в css класс .first{visibility:visible;top:150px;}

Это то, что я использую для достижения этой цели. 

<script type="text/javascript"> 
    $(function() {
        var $items = $("#sidebar > ul >li") 

        $("#mainabout").addClass("first");
        $(".about").mouseover(function() {
            $("#mainabout").addClass("first");
            $("#maineducation").removeClass("first");
            $("#mainexperience").removeClass("first");
            $("#mainprojects").removeClass("first");
            $("#maincontacts").removeClass("first");
            //$("#main").css("background-image","url('revoliution2010_btbg.png')");
        });

        $(".education").mouseover(function() {
            $("#maineducation").addClass("first");
            $("#mainabout").removeClass("first");
            $("#mainexperience").removeClass("first");
            $("#mainprojects").removeClass("first");
            $("#maincontacts").removeClass("first");
        });
        $(".experience").mouseover(function() {
            $("#mainexperience").addClass("first");
            $("#mainabout").removeClass("first");
            $("#maineducation").removeClass("first");
            $("#mainprojects").removeClass("first");
            $("#maincontacts").removeClass("first");
        });
        $(".projects").mouseover(function() {
            $("#mainprojects").addClass("first");
            $("#mainexperience").removeClass("first");
            $("#mainabout").removeClass("first");
            $("#maineducation").removeClass("first");
            $("#maincontacts").removeClass("first");
        });
        $(".contact").mouseover(function() {
            $("#maincontacts").addClass("first");
            $("#mainprojects").removeClass("first");
            $("#mainexperience").removeClass("first");
            $("#mainabout").removeClass("first");
            $("#maineducation").removeClass("first");

        });
    })
</script>

Как мне сделать этот jquery небольшим и оптимизированным или как лучше это сделать.

Ответы [ 2 ]

2 голосов
/ 26 апреля 2011

Я бы пошел с: 

$(".education").mouseover(function() {
    $items.removeClass("first");
    $("#maineducation").addClass("first");
});
// etc..

Вы можете сделать шаг вперед с помощью: 

var regover = function (source, main) {
    source.mouseover(function() {
        $items.removeClass("first");
        main.addClass("first");
    };
};

Тогда ваши регистрационные вызовы будут просто: 

regover($(".education"), $("#maineducation"));

Tiny!

Просто убедитесь, что вы определили regover в той же области, где определено $items.Вот что значит быть «замыканием» - функция ссылается на переменные вне области видимости.Например, 

var $items = ...;
var regover = function(source, main) { ... }

Таким образом, функция может «видеть» переменную $items.

0 голосов
/ 26 апреля 2011

Вы можете написать функцию, которая удаляет все первые классы. Теперь вызовите эту функцию перед добавлением одного необходимого вам класса.

...