0

Isotopeフィルターメニューがあり、ハッシュ履歴を使用しているので、ユーザーがページに戻ってもフィルターは設定されたままです。.slideDownを使用してサブメニュー項目を展開しているため、ページに戻ったときにサブメニュー項目内のいくつかのフィルターが選択されていても、サブメニュー項目は非表示になっています。

私が使おうとしているのは：

if ($('#option1').hasClass('.selected')) {
    $('.level-two').slideDown('fast');
}

ただし、「selected」クラスはjQueryフィルター（Isotope）によって生成されているため、無視されます。

フィドル： http： //jsfiddle.net/RevConcept/swT84/

HTML：

<nav>           

            <div id="options" class="combo-filters">

                <div class="option-combo location">

                    <ul class="filter option-set group level-one" data-filter-group="location"> 

                        <li class="hidden"><a href="#filter-location-any" data-filter-value="" class="selected">any</a></li>

                        <li><a id="option1" href="#filter-location-exterior" data-filter-value=".exterior" class="trigger-two">exterior</a></li>

                        <li><a id="option2" href="#filter-location-interior" data-filter-value=".interior" class="trigger-two">interior</a></li>

                    </ul>

                </div>

                <div class="option-combo illumination">

                    <ul class="filter option-set group level-two" data-filter-group="illumination"> 

                        <li class="hidden"><a href="#filter-illumination-any" data-filter-value="" class="selected">any</a></li>

                        <li><a href="#filter-illumination-illuminated" data-filter-value=".illuminated" class="trigger-three">illuminated</a></li>

                        <li><a href="#filter-illumination-non-illuminated" data-filter-value=".non-illuminated" class="trigger-three">non-illuminated</a></li>

                    </ul>

                </div>

                <div class="option-combo mount">

                    <ul class="filter option-set group level-three" data-filter-group="mount"> 

                        <li class="hidden"><a href="#filter-mount-any" data-filter-value="" class="selected">any</a></li>

                        <li><a href="#filter-mount-wall" data-filter-value=".wall">wall</a></li>

                        <li><a href="#filter-mount-ground" data-filter-value=".ground">ground</a></li>

                    </ul>

                </div>


            </div><!--end options-->

        </nav>

CSS：

header nav ul.level-two, header nav ul.level-three {
display:none;
}

JavaScript：

$(function(){
    $('.level-one').hide().fadeIn('fast');
});


$(".trigger-two").one('click', function(){
    $(".level-two").slideDown('fast'); 
});


$(".trigger-three").one('click', function(){
    $(".level-three").slideDown('fast'); 
});


if ($('#option1').is('selected')) {
    $('.level-two').slideDown('fast');
}
4

2 に答える 2

2

'。'が欠けていると思います。

if ($('#option1').is('.selected')) {
    $('.level-two').slideDown('fast');
}
于 2012-12-05T01:20:36.150 に答える
1

繰り返し機能を使用して各クリックの同じプロセスをコピーするのではなく、選択したアンカーのクリックを常にプログラムでトリガーできます。

$('.option-combo a.selected').trigger('click');

フィドル： http： //jsfiddle.net/jgkwd/

于 2012-12-05T02:15:21.180 に答える