Question

我正在尝试编写Jquery移动应用程序（最新版本），因此当单击JQM按钮时，会打开一个SPECIFIC可折叠列表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>

Answer 1

我为你创造了一个小提琴： 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>

Answer 2

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

如何获取Jquery移动按钮以打开特定的可折叠列表ID？

HTML

JS

2 个答案: