0

我只是在学习 jQuery,我想看看我可以用下面的函数做什么。此函数添加或删除 css 类以创建下拉菜单(实际上是 Stu Nicholl 著名的下拉菜单)。但我并没有走得太远(我已经学习 jQuery 大约一个小时了,所以我的 DOM 遍历还没有完成)。我很想知道使用 jQuery 可以变得多么整洁和优雅,我想看看你们能想出什么。这是现有的功能:

 var getEls = document.getElementById("menu").getElementsByTagName("LI");
 var getAgn = getEls;
 for (var i=0; i<getEls.length; i++) {
 getEls[i].onclick=function() {
 for (var x=0; x<getAgn.length; x++) {
 getAgn[x].className=getAgn[x].className.replace("unclick", "");
 getAgn[x].className=getAgn[x].className.replace("click", "unclick");
 }
 if ((this.className.indexOf('unclick'))!=-1) {
 this.className=this.className.replace("unclick", "");;
 }
 else {
 this.className+=" click";
 }
 }
 }
 }

我的第一次失败是这样开始的:

$(document).ready(function() {
  $('#menu > li').click(function() {
     $('#menu >li > ul').toggleClass('unclick');
  });
});

就目前而言,这是可行的,但接下来的一点被证明是棘手的。所以,如果有人想尝试一下,请成为我的客人:)

4

1 回答 1

0

未经测试,但我认为这可以满足您的要求。

jQuery(function () {
    var menus = jQuery('#menu li');
    var open_menu = function open_menu() {
        var menu_to_open = jQuery(this);
        if (menu_to_open.hasClass('open')) {
            menu_to_open.removeClass('open');
        } else {
            menus.removeClass('open');
            menu_to_open.addClass('open');
        }
    };
    menus.click(open_menu);
});
于 2009-10-08T14:00:31.413 回答