如何获得一个Jquery移动按钮打开特定的可折叠列表Id

How Can I Get a Jquery Mobile Button to Open Specific Collapsible List Id?

本文关键字：Id 列表 可折叠 按钮 移动 何获得 Jquery 一个      更新时间：2023-09-26

我正在尝试编写一个Jquery移动应用程序(最新版本)，所以当JQM按钮被点击时，一个特定的可折叠列表id被打开并定位到视图中。这个按钮应该允许切换。要打开的列表id为id=set2。我到处都找过了，还是没有找到。

这是我当前的代码…

JQM按钮代码…

<a href="#" data-role="button" data-theme="a" id="expand">Find It</a>

HTML 

<div data-role="collapsible-set" data-content-theme="d" id="set">
    <div data-role="collapsible" id="set1" data-collapsed="true">
        <h3>Header 1</h3>
        <p>SOME CODE HERE</p>
    </div>
    <div data-role="collapsible" id="set2" data-collapsed="true">
        <h3>Header 2</h3>
        <p>SOME CODE HERE</p>
    </div>
</div>

JS 

<script type="text/javascript">
    $(document).on("pageinit", function() {
       $("a#expand").click(function() {
           $("#set2").trigger( "expand" );
       });
    });
</script>

我为你创建了一个可以工作的小提琴:
http://jsfiddle.net/acturbo/FZbyh/

下面是jquery代码: 
//$(document).on("pageinit", function() {
$().ready(function() {
    // the "a" should not be needed
    //$("a#expand").on("click", function() {
    $("#expand").on("click", function() {
        $("#set2").trigger( "expand" );
    });
});
html: 

<a href="#" data-role="button" data-theme="a" id="expand">Find It</a>
<div data-role="collapsible-set" data-content-theme="d" id="set">
<div data-role="collapsible" id="set1" data-collapsed="true">
    <h3>Header 1</h3>
    <p>SOME CODE HERE</p>
</div>
<div data-role="collapsible" id="set2" data-collapsed="true">
    <h3>Header 2</h3>
    <p>SOME CODE HERE</p>
</div>

我能够解决这个问题。这是由脚本代码的位置和id名称"expand"引起的，因为这是触发事件的一个选项，id必须由不同的名称组成。

相关文章：