json數據jquery.append格式問題

我試圖爲移動應用程序（使用jQuery Mobile）構建菜單。我有一個查詢SQL來提取菜單項的.asp頁面（現在一個，下面代表json[0].CompanyName）。它作爲JSON數據返回。我想將SQL的值附加到ID爲「mylist」的<ul>。這適用於json[0].CompanyName內的文本並附加文本，但它沒有格式化菜單的硬編碼Item 1和Item 2。爲什麼CSS的格式適用於兩個硬編碼菜單項，但不是動態菜單項？json數據jquery.append格式問題

<div data-role="content" data-theme="b"> 
    <ul id="mylist" data-role="listview" data-inset="true" data-filter="true" > 
    <li><a href="item1.html" >Hard Coded Menu Item 1</a></li> 
    <li><a href="item2.html" >Hard Coded Menu Item 2</a></li> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       $.getJSON("getdata.asp", function (json) { 
        // alert(json[0].CompanyName); 
        $('#mylist').append('<li><a href="#">' + json[0].CompanyName + '</a> </li>'); 
       }); 
      }); 
     </script> 
    </ul> 
    </div>

來源

2011-12-14 Corby Bender

沒有看到問題。你的CSS和生成的html是什麼樣的？你有鏈接到實時頁面嗎？ – swatkins 2011-12-14 19:52:31

你上面看到的是當我在瀏覽器中呈現頁面時查看頁面的源代碼時看到的內容。看起來CSS將應用於頁面上的所有元素，並且它們應該呈現爲......然後腳本被觸發，菜單項將應用於UL，但CSS不會應用於動態添加的項目。有沒有辦法可能重新加載CSS，但只有在腳本執行後？ – 2011-12-14 19:55:51

你必須刷新listview你追加到它後：

 $(function() { 
      $.getJSON("getdata.asp", function (json) { 
       $('#mylist').append('<li><a href="#">' + json[0].CompanyName + '</a> </li>').listview('refresh'); 
      }); 
     });

這將告訴jQuery Mobile的重新初始化listview元到適當的CSS類添加到適當的元素。

文檔可以在這裏找到：http://jquerymobile.com/demos/1.0/docs/lists/docs-lists.html（在頁面的底部是一段名爲更新列表）

有時你遇到，你是不知道，如果listview將尚未初始化的情況，您可以使用此if/then來解決該問題：

var $myList = $('#myList'); 
if ($myList.hasClass('ui-listview')) { 
    $myList.listview('refresh'); 
} else { 
    $myList.listview(); 
}

來源

2011-12-14 19:54:54 Jasper

json數據jquery.append格式問題

回答

相關問題