在创建jQuery Mobile Accordion时,如何在单击按钮时打开手风琴的一部分?
当用户单击搜索按钮时,我想将结果加载到第二个面板中的列表中,折叠第一个面板并展开第二个面板.
<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>
Run Code Online (Sandbox Code Playgroud)
实例:
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>
Run Code Online (Sandbox Code Playgroud)
JS:
$('#search').click(function() {
$('#resultsContainer').trigger('expand');
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
11304 次 |
| 最近记录: |