从 URL 展开特定手风琴答案

【问题标题】：Expand Specific Accordion from URL从 URL 展开特定手风琴
【发布时间】：2015-05-01 12:50:26
【问题描述】：

如果我使用地址“www.xxxxxx.com/test.html#chgd”，则第二个手风琴应该正在展开。

我使用了本网站的源代码“Bootstrap 3 expand accordion from URL”，但在这种情况下不起作用。

不知道根据源代码来扩展第二个基于URL的手风琴有什么问题？

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <link href="C:\Users\h\Desktop\test\bootstrap-theme.css" rel="stylesheet"/>
    <link href="C:\Users\h\Desktop\test\bootstrap.css" rel="stylesheet"/>

    <script src="C:\Users\h\Desktop\test\jquery-1.11.2.min.js"></script>
    <script src="C:\Users\h\Desktop\test\bootstrap.min.js"></script>
    <script>
        var url = document.location.toString();
        if (url.match('#')) {
            $('#' + url.split('#')[1]).addClass('in');
        }
    </script>
</head>

<body>
    <div id="accordion" class="accordion-group">
        <div class="panel">
            <h4 id="cs" class="accordion-title"><a data-toggle="collapse" data-parent="#accordion" data-target="#cs_c">Child
                Survival: Boosting Immunity and Managing Diarrhoea</a></h4>
            <div id="cs_c" class="accordion-collapse collapse in">
                <p>...</p>
            </div>

            <h4 id="chgd" class="accordion-title"><a data-toggle="collapse" data-parent="#accordion" data-target="#chgd_c">Child
                Health, Growth and Development: Preventing Mental Impairment with Iodine and Iron</a></h4>
            <div id="chgd_c" class="accordion-collapse collapse">
                <p>...</p>
            </div>

            <h4 id="wmnh" class="accordion-title"><a data-toggle="collapse" data-parent="#accordion" data-target="#wmnh_c">Women’s
                and Newborn Survival and Health: Iron Supplementation and Food Fortification</a></h4>
            <div id="wmnh_c" class="accordion-collapse collapse">
                <p>...</p>
            </div>
        </div>
    </div>
</body>
</html>

【问题讨论】：

你关闭脚本标签了吗？我可以在您的代码中看到您拥有：'' 它应该是 ''
我正在查看它，但这不是它的原因。

标签： javascript jquery html css twitter-bootstrap

【解决方案1】：

试试这个：

    <script>

    jQuery(document).ready(function() {
        var url = document.location.toString();
        if ( url.match('#') ) {
            var hash = url.split('#')[1];

            // collapse the expanded panel
            $('#accordion .accordion-collapse').removeClass('in');

            // expand the requested panel
            $('#' + hash + '_c').addClass('in');
        }
    });
    </script>

【讨论】：

它有效！顺便说一句，当您要展开面板时，请删除代码： [ $('#accordion .accordion-collapse').removeClass('in'); ]