列出具有多個級別的多行

Question

我的頁面中有三個級別的數據，第一級需要顯示多行數據。

當我只有一個級別的多線完美。所以下面的代碼運行良好。

<ul data-role="listview" 
    data-theme="a" data-inset="true" data-dividertheme="c" data-counttheme="e"> 
      <li> 
       <h3><a href="">Paris (CDG) to Munich (MUC)</a></h3> 
       <h4>150 EUR</h4> 
       <p>12:50 to 14:15 (1h25) Direct</p> 
      </li> 
      <li> 
       <h3><a href="">Paris (CDG) to Munich (MUC)</a></h3> 
       <h4>175 EUR</h4> 
       <p>15:00 to 16:15 (1h15) Direct</p> 
      </li> 
      <li> 
       <h3><a href="">Paris (CDG) to Munich (MUC)</a></h3> 
       <h4>225 EUR</h4> 
       <p>16:00 to 20:00 (4h) wait 2h Frankfurt, Germany</p> 
      </li> 
     </ul> 

並顯示完美的結果。

但是當我添加一些UL顯示嵌套東西的事情開始打破。

我提出以下幾行。

 <ul data-role="listview" data-theme="a" data-inset="true" data-dividertheme="c" data-counttheme="e"> 
      <li> 
       <h3><a href="">Paris (CDG) to Munich (MUC)</a></h3> 
       <h4>150 EUR</h4> 
       <p>12:50 to 14:15 (1h25) Direct</p> 
       <ul> 
        <li><a href="#">View</a></li> 
        <li><a href="#">Submit</a></li> 
        <li><a href="#">Reset</a></li> 
       </ul> 
      </li> 
      </UL> 

它開始打破。並給出如下結果。

任何幫助，將不勝感激。

Answer 1

嘗試下面的鏈接，並檢查您是否使用正確的語法，也許可能你沒有使用jquery mobile或jquery移動可理解代碼中存在的代碼模式。

鏈接：http://jquerymobile.com/test/docs/lists/docs-lists.html#/test/docs/lists/lists-nested.html

Answer 2

它看起來像一個JQM列表視圖作爲直接子不工作嵌套<ul>標籤。它看起來像jQuery Mobile框架中的東西從列表視圖中刪除。

但是，您可以用<div>包裹您的孩子<ul>標籤，該標籤可以正常工作，並且仍然可以根據自己的喜好進行設計。

例如：http://jsfiddle.net/shanabus/MVt2B/