jQuery Mobile系列之Collapsible

<</CODE>div data-role="collapsible">

    <</CODE>h4>Heading</</CODE>h4>

    <</CODE>p>I'm the collapsible content. By default I'm closed, but you can click the header to open me.</</CODE>p>

</</CODE>div>

主題：data-theme

默認展開：data-collapsed = "false"

緊縮：data-mini

圖標：data-collapsed-icon，data-expanded-icon

圖標位置：data-iconpos

表單的話使用fieldset與legend標籤：

<</CODE>form>

    <</CODE>fieldset data-role="collapsible" data-theme="a" data-content-theme="d">

        <</CODE>legend>Legend</</CODE>legend>

        <</CODE>label for="textinput-f">Text Input:</</CODE>label>

        <</CODE>input type="text" name="textinput-f" id="textinput-f" placeholder="Text input" value="">

        <</CODE>div data-role="controlgroup">

            <</CODE>input type="checkbox" name="checkbox-1-a" id="checkbox-1-a">

            <</CODE>label for="checkbox-1-a">One</</CODE>label>

            <</CODE>input type="checkbox" name="checkbox-2-a" id="checkbox-2-a">

            <</CODE>label for="checkbox-2-a">Two</</CODE>label>

            <</CODE>input type="checkbox" name="checkbox-3-a" id="checkbox-3-a">

            <</CODE>label for="checkbox-3-a">Three</</CODE>label>

        </</CODE>div>

    </</CODE>fieldset>

</</CODE>form>

內凹：data-inset="false"