动态添加内容后,jQuery Mobile不会应用样式

Question

我知道这些问题出现在几个地方(迫使jQuery Mobile重新评估动态插入内容的样式/主题)但不是一个对我有用的答案.

我正在使用ajax加载一些内容,并将其插入到div中,如下所示:

       $.ajax({
            url: "../Services/CalendarService.cshtml?service=true",
            cache: false,
            success: function (data) {

                data = $.parseJSON(data);
                var s = $("#user_tmpl").html();
                var s1 = tmpl(s, data);

                $("#target").html(s1);
                $("#targetRefresh").page();
            }
        });

我已经尝试在目标上设置targetRefresh我将html添加到页面上,但没有运气.插入了conent,但未应用样式.

我也试过了

.trigger("enhance")

知道该怎么办？

插入的html是一堆这样的:

<div data-theme="e" data-collapsed="true" data-role="collapsible">         <h3>MyOwner2AA</h3>         <p>MyDescription</p>         <p>/Date(1320339836735)/</p>         <p>MyOwner</p>         <i></i>     </div>

谢谢你的帮助

Larsi

Answer 1

尝试.trigger("create")使用新内容调用元素.

根据jQuery Mobile文档,"该create事件适用于增强包含一个或多个小部件的原始标记."

编辑:从jQuery Mobile 1.4开始,.trigger('create') 不推荐使用,你应该使用它.enhanceWithin().(感谢John Mc的单挑.)

Answer 2

这对我来说是列表视图

$('ul').listview('refresh');

您也可以刷新折叠

$('#element').collapsibleset('refresh')

Answer 3

当我尝试上面的解决方案时,我在Firebug中收到了一条错误消息

未捕获的异常:无法在初始化之前调用listview上的方法; 试图调用方法'刷新'

我发现了一个解决方法,而不是.trigger("create")在我调用的新元素的追加之后调用

$("ul").listview();

在ajax回调函数的末尾.

这让一切都很适合我.希望能帮助到你.

Answer 4

对于上面错过的人，要在动态添加内容后重新应用 JQM 样式，请执行以下操作：

$('.myelement').html( myHtmlStr ).enhanceWithin();