【问题标题】:How to open a jQuery-UI-Accordion section from same accordion or page?如何从同一手风琴或页面打开 jQuery-UI-Accordion 部分?
【发布时间】:2011-06-14 16:46:54
【问题描述】:

这是我现在得到的:

<script type="text/javascript">
    $(function() {
        $("#accordion").accordion({
            collapsible: false,
            autoHeight: false,<br/>
            navigation: true,
            header: 'p.menuitem'
        });
        $("p.menuitem a").click(function(event){
            window.location.hash=this.hash;
        });
    });
</script>

<div id="accordion">
    <div>
        <p class="menuitem" id="item1"><a href="#item1">Section1</a></p>
        <div>Phasellus mattis <a href="#item2">tincidunt</a> nibh.</div>
    </div>
    <div>
        <p class="menuitem" id="item2"><a href="#item2">Section2</a></p>
        <div>Nam dui erat, auctor a, dignissim quis.</div>
    </div>
    <div>
        <p class="menuitem" id="item3"><a href="#item3">Section3</a></p>
        <div>Nam dui erat, auctor a, dignissim quis.</div>
    </div>
</div>

您肯定已经注意到,在手风琴的第 1 节中有一个跳过链接。 需要解决的问题是:

  1. 当调用 tis 页面时,提到的跳过链接可防止手风琴第 2 节打开

    http://www.domain.tld/index.htm#item2
    

    而其他的,

    http://www.domain.tld/index.htm#item1
    

    http://www.domain.tld/index.htm#item3
    

    仍然运行良好。

  2. 单击跳过链接不会打开手风琴的第 2 部分。 有没有机会让这些事情发挥作用?我搜索了很多,但没有成功。

【问题讨论】:

    标签: hyperlink skip jquery-ui-accordion


    【解决方案1】:

    两个问题都解决了!

    <script type="text/javascript">
        $(function() {
            $("#accordion").accordion({
                collapsible: false,
                autoHeight: false,
                navigation: true,
                header: 'p.menuitem'
            });
    
            $("p.menuitem a").click(function(event){
                window.location.hash=this.hash;
            });
    
            if($(location).attr("hash")) $("a[hash="+$(location).attr("hash")+"]").click();
        });
    
        function openpanel(section) {   
            $("#accordion").accordion("activate", section);
        }
    </script>
    
    <div id="accordion">
        <div>
            <p class="menuitem" id="item1"><a href="#item1">Section1</a></p>
            <div>Phasellus mattis <a href="#item2" onclick="javascript:openpanel(1)">tincidunt</a> nibh.</div>
        </div>
        <div>
            <p class="menuitem" id="item2"><a href="#item2">Section2</a></p>
            <div>Nam dui erat, auctor a, dignissim quis.</div>
        </div>
        <div>
            <p class="menuitem" id="item3"><a href="#item3">Section3</a></p>
            <div>Nam dui erat, auctor a, dignissim quis.</div>
        </div>
    </div
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2011-10-11
      • 2011-08-05
      • 2017-07-03
      • 2022-11-19
      • 2014-02-20
      • 2012-02-08
      • 2013-06-19
      • 1970-01-01
      相关资源
      最近更新 更多