Question

所以我已经尝试了所有东西而且似乎无法弄清楚这一点，我所拥有的是一个动态插入数据的手风琴，我需要发生的是我需要将数据的id作为id插入h3部分然后依次点击并打开...

<script>
jQuery(function() {
    jQuery( "#work" ).accordion({
    collapsible: true,
    active: 1});
});
</script>

所以现在第一个H3将会打开，但我希望能够通过H3 id设置哪个div

<h3 id='$record[wid]'>
        <a id='clickable' href='#'>
            <div class='workitem'>
                <span class='mosaic-overlay'>
                    <div class='details'>
                        <a name='$record[wid]'></a>
                        <span class='title'>$record[title]
                        </span>
                    <br />
                        <span class='subtitle'>$record[subtitle]
                        </span>
                    </div>
                </span>
                <span class='mosaic-backdrop'>
                    <img src='/img/work/$record[image]' />
                </span>
            </div>
        </a>
    </h3>

Answer 1

在我在项目中使用的手风琴中，我只是将主动设置为“h3＃”+我要打开的手风琴折叠的ID。

<script type='text/javascript'>
jQuery(function() {
    jQuery( "#work" ).accordion({
    collapsible: true,
    active: "h3#id"
    });
});
</script>

我相信它是标准的jQueryUI手风琴，所以希望它也适合你。

Answer 2

对于遇到这个较旧主题的其他人来说，jQuery Accordion现在使用基于数字的值来表示“有效”选项＆gt; https://api.jqueryui.com/accordion/#option-active＆gt; 0 =第一个手风琴标签＆gt; 1 =第二个手风琴标签 active：1将显示第二个手风琴标签打开/激活。此外，您可能希望使用autoHeight，clearStyle和heightStyle选项，以便在活动折叠选项卡的底部没有其他空格。

<script type="text/javascript">
/* <![CDATA[ */
jQuery(document).ready(function($){
    $( "#accordion" ).accordion({
    collapsible: true,
    active: 1,
    autoHeight: true,
    clearStyle: true,
    heightStyle: "content"
    });
});
/* ]]> */
</script>

Jquery Accordion，按ID设置为活动状态

2 个答案: