Dynamisch auf-und Zuklappen der Abschnitte in Jquery Mobile, Zusammenklappbare Inhalt

Habe ich eine Reduzierbare Inhalte mit Abschnitten wie unten erwähnt

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

<div data-role="collapsible" data-collapsed="false">
<h3>Section A</h3>
<p>I'm the collapsible set content for section B.</p>
</div>

<div data-role="collapsible">
<h3>Section B</h3>
<p>I'm the collapsible set content for section B.</p>
</div>

Den oben genannten block erstellt einen reduzierbaren Inhalten mit zwei Abschnitten mit dem zweiten Abschnitt erweitert.

Möchte ich erweitern, der erste Abschnitt erweitert und zweiten Abschnitt reduziert. Sobald ich irgendeine Handlung vorzunehmen, die im ersten Abschnitt der zweite Abschnitt sollte erweitern, und der erste Abschnitt reduziert werden sollte.

Ich versucht, die änderung der Eigenschaft data-collapsed="true" dynamisch, aber noch nicht als laden ausgebaut.

Kann einer mir helfen dieses Problem zu beheben, oder jede URL, die Listen für die Eigenschaften oder Attribute, die verwendet werden können, zusammen mit reduzierbaren Inhalten

InformationsquelleAutor Prasad | 2011-09-07
  1. 15

    Zur Vereinfachung der code unten nur davon ausgehen, dass zuerst collapsible block id = 'ersten' und zweiten id='zweite', so verwenden:

    $('#blockFirst').trigger('expand');
$('#blockSecond').trigger('collapse');
    • Dies hat mir geholfen, danke! Nur zu vollständig ist die Antwort, es funktioniert auch, wenn data-role="collapsible-set" wird nicht verwendet.
    • Ich glaube nicht, dass es funktioniert für die neueste JQM...
    InformationsquelleAutor pazur
  2. 9
    $("#block").collapsible( "option", "collapsed", false );

    Arbeiten mit JQM 1.4

    Zusammengebrochen Option

    InformationsquelleAutor Richard Fox
  3. 1

    jQuery Mobile wird optisch Stil eine Reihe von collapsibles als Gruppe und machen das set Verhalten sich wie eine Ziehharmonika in sich, dass nur eine Reduzierbare können gleichzeitig geöffnet sein, wenn Sie wickeln die collapsibles in einem div mit dem Attribut data-role="collapsibleset".

    <div data-role="collapsible-set">
<div data-role="collapsible" data-collapsed="false">
<h3>Section 1</h3>
<p>I'm the collapsibleset content for section 1. My content is initially visible.</p>
</div>
<div data-role="collapsible">
<h3>Section 2</h3>
<p>I'm the collapsibleset content for section 2.</p>
</div>
</div>
    InformationsquelleAutor chirag Nandwani
  4. -1

    Entfernen "data-collapsed="false" aus dem ersten Abschnitt, und fügen Sie data-collapsed="true" in den zweiten Abschnitt. Sie nicht haben, um änderungen dynamisch. Das oben ändern, wird die Arbeit wie von Sie.

    • Die Frage war, wie man es dynamisch...
    InformationsquelleAutor Bala
Schreibe einen Kommentar