Question

我正在尝试通过ajax在jquery mobile中动态添加项目到列表视图。

当我返回数据并附加生成的html时，新项目不会继承listview样式属性，我们将非常感谢任何帮助。

$(function() {
    $('.load_more').live("click",function() {
        var a_id = $(this).attr("id");
        var b_id = $(this).attr("data");
    if(a_id!='end'){
        $.ajax({
            type: "POST",
            url: "data.php",
            data: "aid="+ a_id+"&bid="+b_id,
    beforeSend:  function() {
        $('a.load_more').html('<img src="loading.gif" />');

},
    success: function(html){
        $("#more").remove();
        $("ul#updates").append(html);
        $('ul#updates').listview('refresh');
        }
    });
}
        return false;
    });
});

Answer 1

jQuery Mobile不会自动增强动态内容。您必须触发create事件以强制jQM初始化新内容：

$(html).trigger('create');

对于listviews，添加新项目时refresh应该足够了。请参阅此示例http://jsfiddle.net/qrYF7/。

http://jquerymobile.com/demos/1.1.1/docs/pages/page-scripting.html

类似的问题：

Forcing jQuery Mobile to re-evaluate styles/theme on dynamically inserted content

jQuery Mobile does not apply styles after dynamically adding content

Answer 2

我在进行AJAX调用时遇到了类似的问题，并且没有使用listview（）或trigger（）函数。当内容不是动态时，这些对我有用，就像Derek的回复中的jsfiddle一样。我发现的是，如果你使用谷歌ajax API（http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js - 或1.7.1或某些变体），那么listview（）函数将停止在样式方面工作。将此脚本添加到具有静态内容的jsfiddle时，新项不会继承样式。如果您的页面在没有此脚本的情况下工作，则删除它将是一个临时修复。

通过ajax.- Jquery mobile附加项目时，listview不会继承样式

2 个答案: