jQuery Listview Formatting

Question

我一直在研究一个listview，我可以使用jQuery静态地格式化它，但是当我尝试实用地填充数据时，格式不适用。

var resetList = '<ul id="list" data-role="listview" >';
        function getItems(){
                console.log("Get stations");
                navigator.geolocation.getCurrentPosition(locOnSuccess, locOnError);
                document.getElementById('scroller').innerHTML = resetList;
                refreshList();
            }
            function processResult(){
                if(httpResponse.readyState==4 && httpResponse.status==200){
                    var result = jQuery.parseJSON(httpResponse.responseText);
                    for(var x = 0; x < result.stations.length; x++){
                        var var1 = result.stations[x].var1;
                        var var2 = result.stations[x].var2;
                        var var3 = result.stations[x].var3;
                        var var4 = result.stations[x].var4;
                        var var5 = result.stations[x].var5;
                        var var6 = result.stations[x].var6;
                        createListItem(var1, var2, var3, var4, var5, var6);
                        refreshList();
                    }
                }
            }
    function refreshList(){
                    $("list").listview().listview('refresh');
    }
    function createListItem(var1, var2, var3, var4, var5, var6){
        var listItem = '<li><h2>' + var1 + '</h2><span class="ui-li-aside">' + var2 + '</span> <h4>' + var3 + '</h4><p>' + var4 + '</p></li>';
        document.getElementById('list').innerHTML += listItem;
    }

新代码

var resetList = '<ul id="list" data-role="listview" >';
            function getItems(){
                    console.log("Get stations");
                    navigator.geolocation.getCurrentPosition(locOnSuccess, locOnError);
                    document.getElementById('scroller').innerHTML = resetList;
                    refreshList();
                }
                function processResult(){
                    if(httpResponse.readyState==4 && httpResponse.status==200){
                        var result = jQuery.parseJSON(httpResponse.responseText);
                        for(var x = 0; x < result.stations.length; x++){
                            var var1 = result.stations[x].var1;
                            var var2 = result.stations[x].var2;
                            var var3 = result.stations[x].var3;
                            var var4 = result.stations[x].var4;
                            var var5 = result.stations[x].var5;
                            var var6 = result.stations[x].var6;
                            createListItem(var1, var2, var3, var4, var5, var6);
                            refreshList();
                        }
                    }
                }
        function createListItem(var1, var2, var3, var4, var5, var6){
            $('list').append('<li><h2>' + var1 + '</h2><span class="ui-li-aside">' + var2 + '</span> <h4>' + var3 + '</h4><p>' + var4 + '</p></li>').listview().listview('refresh');
        }

Answer 1

我可以通过使用

$('list').append('<li><h2>' + var1 + '</h2><span class="ui-li-aside">' + var2 + '</span> <h4>' + var3 + '</h4><p>' + var4 + '</p></li>').listview().listview('refresh');

更新以上代码