如何通过按钮点击切换jQuery Mobile手风琴？

Question

如何通过按钮点击切换jQuery Mobile手风琴？

4

创建jQuery Mobile手风琴时，如何在单击按钮时打开手风琴的某个部分？

当用户单击搜索按钮时，我希望将结果加载到第二个面板中的列表中，折叠第一个面板并展开第二个面板。

<div data-role="collapsible-set">

    <div id="filterContainer" data-role="collapsible" data-collapsed="false">
        <h3>Filters</h3>
        <p>controls to pick options</p>
        <a href="#" data-role="button" id="search">Search</a>
    </div>

    <div id="resultsContainer" data-role="collapsible">
        <h3>Results</h3>
        <p>list of results</p>
    </div>

<div>

- Homer

1

我猜我找到了一个答案，但不确定它是否是“正确”的：$('#resultsContainer a:first').click(); - Homer

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Phill Pafford · Accepted Answer

现场演示：

http://jsfiddle.net/h2pPz/19/

HTML：

<div data-role="page" id="home" class="type-home"> 
    <div data-role="content">
        <div data-role="collapsible-set">

            <div id="filterContainer" data-role="collapsible" data-collapsed="false">
                <h3>Filters</h3>
                <p>controls to pick options</p>
                <!-- Either button syntax works -->
                <!-- <a href="#" data-role="button" id="search">Search</a> -->
                <input type="button" value="Search" id="search"/>
            </div>

            <div id="resultsContainer" data-role="collapsible" data-collapsed="true">
                <h3>Results</h3>
                <p>list of results</p>
            </div>

        <div>
    </div>
</div>

JS：

$('#search').click(function() {
    $('#resultsContainer').trigger('expand');
});