带有子标题的标题的JQuery Mobile可折叠集一次只能打开一个

Question

以下是我试过的Js小提琴：

My JSFiddle

以下是我的HTML：

                   <div data-role="collapsible" data-theme="b" data-collapsed="false">
                   <h3>Sell</h3>

                            <div data-role="collapsible" data-theme="c" class="expand-lead">
                                <h3>
                                    <span>Andy Stenberg</span>
                                    <span class="span-confidence" style="background-color:red"></span>
                                </h3>
                                <div>
                                    <span class="collapsible-items">Contact:</span>
                                    <a href="tel:2139090090">(213)909-0090</a>
                                    <br>
                                    <span class="collapsible-items">Location:</span><span class="collapsibleitem-bold">Los Angeles</span>
                                    <div id="confid-sellrate1"></div>
                                </div>
                            </div>

                            <div data-role="collapsible" data-theme="c" class="expand-lead">
                                <h3>
                                    <span>Halle Berry</span>
                                    <span class="span-confidence" style="background-color:orange"></span>
                                </h3>
                                <div>
                                    <span class="collapsible-items">Contact:</span>
                                    <a href="tel:xxxxxxxxxx">(xxx)xxx-xxxx</a>
                                    <br>
                                    <span class="collapsible-items">Location:</span><span class="collapsibleitem-bold">Hollywood Hills,LA</span>
                                    <div id="confid-sellrate2"></div>
                                </div>
                            </div>

                            <div data-role="collapsible" data-theme="c" class="expand-lead">
                                <h3>
                                    <span>Cierra Quigg</span>
                                    <span class="span-confidence" style="background-color:orange"></span>
                                </h3>
                                <div>
                                    <span class="collapsible-items">Contact:</span>
                                    <a href="tel:XXXXXXXXXX">(XXX)XXX-XXXX</a>
                                    <br>
                                    <span class="collapsible-items">Location:</span><span class="collapsibleitem-bold">Burbank</span>
                                    <div id="confid-sellrate3"></div>
                                </div>
                            </div>
                  </div>

                    </div>

任何人都可以帮助我让子标题一次只打开一个吗？

Answer 1

工作示例：http://jsfiddle.net/Gajotres/rK8KK/

HTML：

<div data-role="collapsible" data-theme="b" class="expand-lead">
    <h3>Sell</h3>    
    <div data-role="collapsible-set" data-theme="b" data-collapsed="false">  
        <div data-role="collapsible" data-theme="c" class="expand-lead">
            <h3>
                <span>Andy Stenberg</span>
                <span class="span-confidence" style="background-color:red"></span>
            </h3>
            <div>
                <span class="collapsible-items">Contact:</span>
                <a href="tel:2139090090">(213)909-0090</a>
                <br/>
                <span class="collapsible-items">Location:</span><span class="collapsibleitem-bold">Los Angeles</span>
                <div id="confid-sellrate1"></div>
            </div>
        </div>

        <div data-role="collapsible" data-theme="c" class="expand-lead">
            <h3>
                <span>Halle Berry</span>
                <span class="span-confidence" style="background-color:orange"></span>
            </h3>
            <div>
                <span class="collapsible-items">Contact:</span>
                <a href="tel:xxxxxxxxxx">(xxx)xxx-xxxx</a>
                <br/>
                <span class="collapsible-items">Location:</span><span class="collapsibleitem-bold">Hollywood Hills,LA</span>
                <div id="confid-sellrate2"></div>
            </div>
        </div>

        <div data-role="collapsible" data-theme="c" class="expand-lead">
            <h3>
                <span>Cierra Quigg</span>
                <span class="span-confidence" style="background-color:orange"></span>
            </h3>
            <div>
                <span class="collapsible-items">Contact:</span>
                <a href="tel:XXXXXXXXXX">(XXX)XXX-XXXX</a>
                <br/>
                <span class="collapsible-items">Location:</span><span class="collapsibleitem-bold">Burbank</span>
                <div id="confid-sellrate3"></div>
            </div>
        </div>
    </div>
</div>