0

私はちょうどjQueryを学んでおり、以下の関数で何ができるかを見たいと思っていました. この関数は、css クラスを追加または削除して、プルダウン メニューを作成します (実際には、Stu Nicholl のよく知られたプルダウン メニューです)。しかし、私はあまり進んでいません (jQuery を約 1 時間学習しているので、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 に答える