在jqmobile中顯示列表縮略圖列表的問題

Question

您好，我在jqmobile中顯示縮略圖列表時遇到問題。

如果我試圖>

 <li> 

     <img src="images/album-bb.jpg" /> 

     <h3><a href="index.html">Broken Bells</a></h3> 

     <p>Broken Bells</p> 

     </li> 

一切都OK，並期待它像>

http://jquerymobile.com/demos/1.0a3/docs/lists/lists-thumbnails.html

但如果我嘗試通過動態

$(document).ready(function() { 
    $.ajax({ 
     type: "GET", 
     url: "data.xml", 
     dataType: "xml", 
     success: xmlParser 
    }); 
}); 

function xmlParser(xml) { 

//Hide .gif loader image if data are succesully fetched 
    // $('#load').fadeOut(); 

    $(xml).find("SHOPITEM").each(function() { 

    $("ul").append("<li><img width=\"80px\" src=\""+$(this).find('IMGURL').text()+"\"/><h3><a href=\""+$(this).find('URL').text()+"\">"+$(this).find('PRODUCT').text()+"</a></h3><p>"+$(this).find('PRICE_VAT').text()+"</p></li>"); 


    }); 



} 

我產生它項目顯示，但內容不格式化正確。

請問哪裏有問題？

感謝您的任何建議..

Answer 1

你可能已經解決了這個現在，但如果沒有，併爲他人着想誰可能有同樣的問題，我會後這個潛在的解決方案：

您的CSS很可能不會被應用到通過AJAX函數生成並插入到DOM中的DOM元素（HTML）。如果不處理它，我會懷疑你可能不得不將CSS內聯應用到插入的HTML中。

我遇到了類似的問題，通過AJAX插入HTML並嘗試向其應用新的JavaScript功能。 jQuery提出了一個稱爲「live（）」函數的解決方案，但我不確定jQuery是否具有以相同方式應用CSS的內置函數。

所以這樣一行：

.append('<li>This text is red</li>'); 

將成爲：

.append('<li style="blue">This text is blue</li>'); 

裏克

Answer 2

我認爲你需要更新JavaScript中的列表視圖，以獲得格式：

來自http://jquerymobile.com/test/docs/lists/docs-lists.html： ​​