Question

我是jQuery Mobile的新手。我正在尝试使用主index.html（包含页眉，页脚和主页面主体）和多个页面部分（每个文件一页）实现一个站点。

交换到该主体的其中一个部分使用Tabs小部件。当我触发到此页面的链接时，标签会加载“平面”，正如人们所期望的那样，当jQUI / jQM代码不起作用时。

如果我在index.html中放置相同的标记，它看起来很好。我的猜测是需要运行一些东西来初始化辅助页面，但我不知道是什么。我已经在监听pagechange，但不知道要调用什么来初始化Tabs小部件。

我把代码扔进了这个Plunkr，但jQM似乎没有在那里工作（只有jQUI？）。

Answer 1

这似乎是Jquery mobile Tabs not working on external page的副本，引用jQM issue 7169。该修复程序针对1.5版本。

来自gabrielschulhof的this comment给出了解决方法：

$.widget( "ui.tabs", $.ui.tabs, {
    _createWidget: function( options, element ) {
        var page, delayedCreate,
            that = this;

        if ( $.mobile.page ) {
            page = $( element )
                .parents( ":jqmData(role='page'),:mobile-page" )
                .first();

            if ( page.length > 0 && !page.hasClass( "ui-page-active" ) ) {
                delayedCreate = this._super;
                page.one( "pagebeforeshow", function() {
                    delayedCreate.call( that, options, element );
                });
            }
        } else {
            return this._super();
        }
    }
});

jQuery Mobile在链接页面上显示所有Tab容器

1 个答案: