jQuery mobile listview不能像演示頁面上那樣工作

Question

ic從該頁面的第二個listview復制了源代碼：

http://demos.jquerymobile.com/1.4.1/listview-collapsible-item-flat/

<ul data-role="listview" data-inset="true" data-shadow="false">
  <li data-role="collapsible" data-iconpos="right" data-inset="false">
    <h2>Birds</h2>
    <ul data-role="listview" data-theme="b">
      <li><a href="#">Condor</a></li>
      <li><a href="#">Eagle</a></li>
      <li><a href="#">Sparrow</a></li>
    </ul>
  </li>
  <li><a href="#">Humans</a></li>
  <li data-role="collapsible" data-iconpos="right" data-inset="false">
    <h2>Fish</h2>
    <ul data-role="listview" data-theme="b">
      <li><a href="#">Salmon</a></li>
      <li><a href="#">Pollock</a></li>
      <li><a href="#">Trout</a></li>
    </ul>
  </li>
  <li data-role="collapsible" data-iconpos="right" data-inset="false">
    <h2>Choose your preference</h2>
    <form>
      <fieldset data-role="controlgroup" data-type="horizontal">
        <label>Birds<input type="checkbox" id="choose-birds-inset"></label>
        <label>Humans<input type="checkbox" id="choose-humans-inset"></label>
        <label>Fish<input type="checkbox" id="choose-fish-inset"></label>
      </fieldset>
    </form>
  </li>
</ul>

我使用此代碼在我的頭部使用jquery：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" />

而且列表看起來不像是演示。

同樣在JSFIDDLE上：

http://fiddle.jshell.net/7uSAP/

Answer 1

您錯過了一些CSS規則，僅此而已：

.ui-li-static.ui-collapsible > .ui-collapsible-heading {
        margin: 0;
    }

    .ui-li-static.ui-collapsible {
        padding: 0;
    }

    .ui-li-static.ui-collapsible > .ui-collapsible-heading > .ui-btn {
        border-top-width: 0;
    }

    .ui-li-static.ui-collapsible > .ui-collapsible-heading.ui-collapsible-heading-collapsed > .ui-btn,
    .ui-li-static.ui-collapsible > .ui-collapsible-content {
        border-bottom-width: 0;
    }

工作提琴： http : //jsfiddle.net/robertrozas/FLLfz/