Question

在调用Ajax后页面丢失了JQMobile CSS，即使我添加了：

$("#idlist").listview("refresh");

在我的代码中：

$(document).ready(function() {
var display= $("#displaydata");
    function displaydata()
{
    $.ajax({
        crossDomain:true,
        type:"GET",
        data:"lihat==suku",
        url:"server.php",
        success: function(data){        
        display.html(data);

        }
    });
}

displaydata(); });

我从PHP调用数据，这是我的PHP代码：

    if(isset($_GET["lihat"])=="suku")
{
    $tampil = mysql_query("select * from deskripsi");
    echo"<ul id='ul' data-role='listview' data-inset='true' data-filter='true' data-filter-placeholder='Cari Suku Besar...'>";
    while($r = mysql_fetch_array($tampil))
    {
        echo"<li>$r[suku]</li>";    
    }
    echo"</ul>";
}

Answer 1

这是一个建议：

在 PHP 代码中，构建 HTML 字符串，最后回显字符串值。

像这样：

if(isset($_GET["lihat"])=="suku") {
    $tampil = mysql_query("select * from deskripsi");
    $string = "<ul id='ul' data-role='listview' data-inset='true' data-filter='true' data-filter-placeholder='Cari Suku Besar...'>";
    while($r = mysql_fetch_array($tampil)) {
        $string .= "<li>$r[suku]</li>";    
    }
    $string .= "</ul>";
    echo $string;
}

在追加响应数据后，在你的ajax成功函数中添加以下代码：

$("#idlist").listview().trigger("create");

...享受

Answer 2

按f12，然后看到您收到任何错误消息。您确定收到的回复是否正确？

您需要成功，如下所示。 html()只会替换div中的所有内容，因此您必须重新添加<ul></ul>标记。

    success: function(data){ 
        var tempString = "<ul data-role='listview'>";
        tempString += data;
        tempString += "</ul>";
        display.html(tempString);
    }

尝试并刷新列表视图，如下所示

$("#idlist").listview();

$("#idlist").listview("refresh");似乎适用于现有的listview而不是我们从scractch构建的那个。

即使使用（.listview（“refresh”）），jQuery Mobile css在ajax调用后也不起作用

2 个答案: