Jquery移动列表视图与PHP不能正确显示


jquery mobile listview with php not showing corectly

我从mySQL和php填充listview,但是当响应文本回落到html中时,它显示为纯文本,而不是listview。这是我的html代码:

<div data-role="page" id="myevents" data-theme="a">
<?php include("profileHeader.php");?>
<div data-role="main" class="ui-content" >
<div data-role="collapsible" data-collapsed="false"><h2>My events</h2>
<ul data-role="listview" id="myeventslist" data-inset="true">
</ul></div>
    </div>

脚本在html文件中:

<script>
$(document).on("pagecreate","#myevents",function(){
var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("myeventslist").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "myeventslist.php", true);
    xmlhttp.send();
});

这是我的php脚本(myeventslist.php文件):
//before this is PDO statement
    $myeventslist = '';
    foreach($stmtmyeventslist->fetchAll(PDO::FETCH_ASSOC) as $myeventsrow){
        $myeventslist .= '<li>' . $myeventsrow['eventname'] . '</li>';
        }

$db=null; // Closing Connection
} catch (PDOException $e) {
//echo $e->getMessage();
echo "Error. Try again in 15 minutes";
die();
}
echo $myeventslist;

但结果不是我所期望的:(:)嘿,我没有10级的声望来发布图片

我找到了一个解决方案。在html脚本块必须包含:

$("#myeventslist").append(xmlhttp.responseText);
            $("#myeventslist").listview('refresh');

代替:

document.getElementById("myeventslist").innerHTML = xmlhttp.responseText;