Jquery mobile listview格式化的文本无法通过php工作



我在Javascript中有以下函数。

function showInfo(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
} 
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","information.php?q="+str,true);
xmlhttp.send();
}

我已经创建了一个选择,这样一旦选择了某个东西,它就会显示一个列表。

<ul>
<li><select name="days" id="days" onchange="showInfo(this.value)" data-native-menu="false">
<option value="">  select   </option>
<option value="1"> option 1 </option>
<option value="2"> option 2 </option>
</select></li>
</ul>

information.php获取值并查询数据库以获取列表中所需的信息。这一切都很好,但当我想显示列表时,它的格式不正确。

echo '
<ul data-role="listview">
<li>
<h3>Author:'.$the_author.'</h3>
<p><b>Description:</b>'.$description.'</p>
<p class="ui-li-aside">Last update:'.$date.'</p>
</li>
//Etc.
</ul>
';

现在显示的列表应该与jquery移动演示中的列表相似(http://demos.jquerymobile.com/1.0.1/docs/lists/lists-formatting.html)

然而,它看起来像一个标准的html列表。

因为您正在动态创建<UL>元素,而不仅仅是列表项,所以需要调用enhanceWithin()(http://api.jquerymobile.com/enhanceWithin/)在设置其HTML 后的txtHint上

取而代之的是:

xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}

尝试

xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
$('#txtHint').append(xmlhttp.responseText).enhanceWithin();
}
}

这是一个正在运行的DEMO,带有一个模拟AJAX调用

最新更新