我在这里使用jQuery UI进行侧边栏导航:http://www.imadesign.com/dev/work/

我希望能够使手风琴在当前活动部分保持打开状态。因此,例如,如果我在此页面上:http://www.imadesign.com/dev/work/infrastructure/inland_empire_utilities_agency,则基础结构手风琴将保持打开状态。

这是html:

<div id="accordion">
<div>
<h3><a href="#">Infrastructure</a></h3>
<div>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/green_valley_ranch">Green Valley Ranch</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/irvine_spectrum">Irvine Spectrum</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/lynwood">Lynwood</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/inland_empire_utilities_agency">Inland Empire Utilities Agency</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/center_for_regenerative_studies">Center for Regenerative Studies</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/agriscapes">Agriscapes</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/sepulveda_basin_wildlife_area">Sepulveda Basin Wildlife Area</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/upper_newport_bay_regional_park">Upper Newport Bay Regional Park</a></p>
<p><a href="http://www.imadesign.com/dev/work/infrastructure/los_angeles_world_airports">Los Angeles World Airports</a></p>
</div>
</div>
<div>...


这是jQuery:

<script type="text/javascript">
$(function(){

    // Accordion
    $("#accordion").accordion({ header: "h3", autoHeight: false, collapsible: true, active:false });

    //hover states on the static widgets
    $('#dialog_link, ul#icons li').hover(
        function() { $(this).addClass('ui-state-hover'); },
        function() { $(this).removeClass('ui-state-hover');
        });
});
</script>


任何指导将不胜感激。谢谢。

最佳答案

您可以查看URL是否出现在任何链接的href中,然后显示相应的div

它并不完美,但至少是通用的,您可以根据需要进行修改...

我做了一个小提琴:

http://jsfiddle.net/TKgsQ/1/

编辑:

这是初始化手风琴后必须放在$(function(){});中的代码

var arr = window.location.toString().split('/');
var currentUrl = arr[arr.length -1];
$("#accordion a").each(function(){
    arr = $(this).attr("href").split("/");
    var linkUrl = arr[arr.length -1]; //get last part
    if(linkUrl == currentUrl)
        $(this).css('background-color','yellow').closest('div').show();
});

09-20 09:07