-1

私は正常に動作する jQuery メニューを持っています。CSS スプライトを追加して、「li」を閉じるとプラス記号が表示され、展開するとマイナス記号が表示されるようにします。

以下のコードに基づく提案はありますか？

ありがとうございました

$(document).ready(function() {

$('#sidenav > li > ul, #sidenav > li > ul > li > ul').hide();

$('#sidenav > li').click(function(){
$ul = $(this).children('ul').slideDown('slow');
$('#sidenav > li > ul').not($ul).slideUp('slow');
});

$('#sidenav > li > ul > li').click(function(){
$ul = $(this).children('ul').slideDown('slow');
$('#sidenav > li > ul > li ul').not($ul).slideUp('slow');
}); 
});

HTML

<ul id="sidenav">
<li class=""><a href="#">Menu 1</a>
    <ul>
        <li class=""><a href="#">Submenu 1</a>     
            <ul>            
                <li>Submenu-1A</li>
                <li>Submenu-2A</li>                    
            </ul>        
        </li>
        <li class=""><a href="#">Submenu 2</a>      
            <ul>
                <li>Submenu-1A</li>
                <li>Submenu-2A</li>                    
            </ul>            
        </li>
        <li>Submenu 3</li>
    </ul>
</li>

<li class=""><a href="#">Menu 2</a>
    <ul>
        <li>Submenu 1</li>
        <li>Submenu 2</li>
        <li>Submenu 3</li>
    </ul>
</li>

<li class=""><a href="#">Menu 3</a>
    <ul>
        <li>Submenu 1</li>
        <li>Submenu 2</li>
        <li>Submenu 3</li>
    </ul>
</li>
</ul>
4

3 に答える 3

0

li wanがクリックしたときのようなクラスを追加activeしたり、たとえば次のように削除したりできます。

$('li').click(function(){
    $(this).toggleClass('active');
});

cssでは、通常の場合はプラス画像を表示し、通常の場合はマイナス画像を表示しますactive

于 2012-07-05T11:41:29.613 に答える
0

li がアクティブな場合はクラスを追加し、それに応じてスタイルを定義します。

このようなもの：

li{
   background: url(...) no-repeat 0 0;
}

li.active{
   background-position:20px 0; <- adjust accordingly
}

クリックハンドラもトグル クラスに追加します。

$('#sidenav > li').click(function(){
   ...
   $(this).toggleClass("active");
});

クリックハンドラーを書き直して、コードからファズ全体を取り除くことができます。

(未テスト)

$('#sidenav li').click(function(){
   $(this).toggleClass("active")
          .children("ul").toggleSlide();
});
于 2012-07-05T11:39:20.587 に答える
0

html() の助けを借りて + または - があるかどうかを確認する助けを借りて、そのスパンでは最初に「+」記号があります

jQuery("id").toggle();
    var cur_symbol = jQuery('id span').html();
     if(cur_symbol == ' + '){jQuery('id span').html(' - ');}
     else{jQuery('#more_opt span').html(' + ');}
        });
于 2012-07-05T11:47:37.463 に答える