且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

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

更新时间:2022-12-27 22:47:14

尝试在具有新内容的元素上调用 .trigger("create").

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

编辑:从 jQuery Mobile 1.4 开始,.trigger('create') 已弃用,您应该使用 .enhanceWithin() 代替.(感谢 John Mc 的提醒.)

I know this questions appear several places (Forcing jQuery Mobile to re-evaluate styles/theme on dynamically inserted content) but not with an answer that is working for me.

I'm loading some content using ajax, and inserting it into a div like this:

       $.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();
            }
        });

I've tried setting the targetRefresh on both the target I'm adding the html to, and on the page, but with no luck. The conent is inserted, but styles not applied.

I've also tried

.trigger("enhance")

Any idea what to do?

The html that inserted are a bunch of these:

<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>

Thanks for any help

Larsi

Try calling .trigger("create") on the element with the new content.

According to the jQuery Mobile docs, "The create event is suited for enhancing raw markup that contains one or more widgets."

EDIT: As of jQuery Mobile 1.4, .trigger('create') is deprecated, and you should use .enhanceWithin() instead. (Thanks to John Mc for the heads-up.)