如何以编程方式扩展 Jquery 的 data-roll="collapsible"

How to programatically expand a Jquery's data-role="collapsible"

我需要你的帮助来语法扩展 Jquery 的 Collapsable div

我已经尝试了很多选项

这是我的 fiddle

http://jsfiddle.net/jWaEv/20/

我试过如下

<div data-role="content" class="data">
    <div class="my-collaspible" id="first" data-inset="false" data-role="collapsible">
         <h3>Header 1</h3>

        <p>Content</p>
        <p>Content</p>
    </div>
    <div class="my-collaspible" id="second" data-inset="false" data-role="collapsible">
         <h3>Header 2</h3>

        <p>Content</p>
        <p>Content</p>
        <p>Content</p>
        <p>Content</p>
    </div>
</div>

 $(document).ready(function() {
   var id = 'first';
   $("#" + id).trigger('expand').collapsible("refresh");
 });

你能告诉我怎么做吗??

使用以下选项:collapsible,

$("#" + id).collapsible( "option", "collapsed", false );

Updated Fiddle

你可以使用这个:

http://jsfiddle.net/jWaEv/37/

<div data-role="collapsible-set">
    <div id="first" data-role="collapsible">
      <h3>Header 1</h3>
      <p>Content</p>
      <p>Content</p>
    </div>
    <div id="second" data-role="collapsible">
      <h3>Header 2</h3>
      <p>Content</p>
      <p>Content</p>
      <p>Content</p>
      <p>Content</p>
    </div>
</div>
<input type="button" value="Test" id="btn1" />

和 JS:

 $(document).ready(function() {
   $("#first").collapsible('expand');

   //test
   $('#btn1').click(function(){
     $("#first").collapsible('collapse');
   });
});

("#myCollapsible").collapsible("expand");

这对我有用 jQuery 1.11.1 和 JQM 1.4.5