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

时间:2011-11-03 17:39:55

标签: ajax jquery-mobile

我知道这些问题出现在几个地方(Forcing jQuery Mobile to re-evaluate styles/theme on dynamically inserted content),但没有一个对我有用的答案。

我正在使用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

3 个答案:

答案 0 :(得分:92)

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

根据jQuery Mobile docs,“create事件适合增强包含一个或多个小部件的原始标记。”

编辑:从jQuery Mobile 1.4开始,.trigger('create') is deprecated,您应该使用.enhanceWithin()代替。 (感谢John Mc的单挑。)

答案 1 :(得分:33)

这适用于我的列表视图

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

您也可以刷新可折叠的

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

答案 2 :(得分:5)

当我尝试上述解决方案时,我在Firebug中收到错误消息

  

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

我找到了一个解决方案,但是在我调用的新元素的追加之后调用.trigger("create")

$("ul").listview();

在ajax回调函数的末尾。

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