从URL展开特殊手风琴 [英] Expand Specific Accordion from URL

查看:161
本文介绍了从URL展开特殊手风琴的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

If I use the adress "www.xxxxxx.com/test.html#chgd", the second accordion should be expanding.

我使用了源代码从此网站 Bootstrap 3展开手风琴URL ,但它不工作在这个上下文中。

I have used the source code from this website 'Bootstrap 3 expand accordion from URL' but it does not work in this context.

我不知道基于源代码的问题是什么,以便根据URL扩展第二个手风琴?

I do not know what is the problem based on the source code in order to expand the the second accordion based on 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>


推荐答案

尝试:

    <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>

这篇关于从URL展开特殊手风琴的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆