ListView jQuery Mobile中的一些非常奇怪的东西[重复]

Question

如果我写这个：

 <ul data-role="listview" data-inset="true">
            <li>
                <a href="#">
                    <img src="PIC/999.jpeg">
                    <h2>Google Chrome</h2>
                    <p>Google Chrome is a free, open-source web browser. Released in 2008.</p>
                </a>
                <a href="#">Some Text</a>
            </li>
            <li>
                <a href="#">
                    <img src="PIC/999.jpeg">
                    <h2>Mozilla Firefox</h2>
                    <p>Firefox is a web browser from Mozilla. Released in 2004.</p>
                </a>
                <a href="#">Some Text</a>
            </li>
        </ul>

我看到了漂亮的设计

但我的移动网络需要这个：

<script>
        function XX() {

            if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }
            else {// code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.open("GET", "1.xml", false);
            xmlhttp.send();
            xmlDoc = xmlhttp.responseXML;

            $("#ZIBI").empty();

            var ALL;
            var ID,Fname, Lname, Phone,Car;

            var x = xmlDoc.getElementsByTagName("men");
            for (i = 0; i < x.length; i++) {
                try{ID = x[i].getElementsByTagName("ID")[0].childNodes[0].nodeValue;}
                catch (err) { ID = "0";}
                try{Fname = x[i].getElementsByTagName("Fname")[0].childNodes[0].nodeValue;}
                catch (err) { Fname = "0"; }
                try{Lname = x[i].getElementsByTagName("Lname")[0].childNodes[0].nodeValue;}
                catch (err) { Lname = "0"; }
                try{Phone = x[i].getElementsByTagName("S_phone")[0].childNodes[0].nodeValue;}
                catch (err) { Phone = "0"; }
                try { Car = x[i].getElementsByTagName("car")[0].childNodes[0].nodeValue; }
                catch (err) { Car = "0"; }
                ALL = 
                      '<li>' +
                      '<a href="#">' +
                      '<img src="PIC/' + ID + '.jpeg">' +
                      '<p class="nam">' + Fname + " " + Lname + '</p>' +
                      //'<p class="des">' + Lname + '</p>' +
                      '<p class="phn">' + Phone + '</p>' +
                      '<p class="crr">' + Car + '</p>' +
                      '<hr>' +
                      '</a>' +
                      '</li>' 

                $("#ZIBI").append(ALL);
            }
        }
    </script>


 <ul data-role="listview" data-inset="true" id="ZIBI" data-autodividers="true" data-filter="true" ></ul>  

我看到了这个丑陋的设计

Answer 1

来自 jqueryMobile 文档：

更新列表：

如果您将项目添加到列表视图，则需要对其调用 refresh() 方法来更新样式并创建添加的任何嵌套列表。例如：

$('#mylist').listview('refresh');

请注意，refresh() 方法仅影响附加到列表的新节点。这样做是出于性能原因。刷新过程将忽略任何已增强的列表项。这意味着如果您更改已增强列表项的内容或属性，这些将不会被反映。如果您想要更新列表项，请在调用刷新之前将其替换为新标记。