Question

我有以下JQuery代码来操作我的手风琴菜单。

<script type="text/javascript" src="_js/jquery-1.11.1.js"></script>
<script type="text/javascript">
    $(function() {
        var url = window.location.href;
        $('.menu a[href="'+url+'"]').addClass('current_page_item');
        $("dd:not(:first)").hide();
        $("dt a").click(function() {
            $("dd").slideUp("fast");
            $(this).parent("dt").next("dd").slideDown("normal");
        });	
    });
</script>

如何修改代码以检测“selected”类并从以下html脚本中打开相应的面板。

<div id="SideMenu">
    <dl>
        <li class="mtop">&nbsp;</li>
        <dt><a href="/index.php">Home</a></dt>
        <dt><a href="#">A.A. Theory</a></dt>
        <dd>
            <ul>
                <li class="litop"><a href="#">Link 5</a></li>
                <li class="limid"><a href="#">Link 6</a></li>
                <li class="limid"><a href="#">Link 7</a></li>
                <li class="libot"><a href="#">Link 8</a></li>
            </ul>
        </dd>
        <dt><a href="#">Glossaries</a></dt>
        <dd>
            <ul>
                <li class="litop"><a href="#">Astronomical</a></li>
                <li class="limid selected"><a href="#">Star Trek</a></li>
                <li class="limid"><a href="#">Science</a></li>
                <li class="libot"><a href="#">Mathematics</a></li>
            </ul>
        </dd>
        <li class="mbot">&nbsp;</li>
    </dl>
</div>

Answer 1

使用jQuery，您可以快速访问所选元素：

$(".selected")

知道这一点，并且知道这个元素是<li>标记，我们只需要在页面加载后滑动其父<ul>。因此，您只需在$(document).ready();函数中添加此代码：

$(".selected").parent().slideDown();

以下是修改后的FIDDLE

基于.class的JQuery Accordion开放面板

1 个答案: