幫助將jQuery功能移植到jQuery - 學習工具

我只是在學習jQuery，我想看看我可以用下面的函數做些什麼。這個函數添加或刪除css類來創建一個下拉菜單（實際上是Stu Nicholl衆所周知的下拉菜單）。但是我並沒有走得太遠（我現在一直在學習jQuery，因此我的DOM遍歷尚未完成）。我很好奇，看看它可以使用jQuery如何整齊和優雅，並認爲我會看到你們可以想出什麼。這是現有的功能：幫助將jQuery功能移植到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'); 
    }); 
});

說，就因爲它去工作，但下位證明棘手。所以，如果任何人覺得有一個去，請成爲我的客人:)

來源

2009-10-08 user97410

不要在循環中使用''this''作爲字符串文字 – 2009-10-08 13:59:57

是的，我發佈了錯誤的代碼 – user97410 2009-10-08 14:02:13

未經測試，但我認爲這是你想要的。

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-08 14:00:31 Quentin

幫助將jQuery功能移植到jQuery - 學習工具

回答

相關問題