javascript – 页面加载时jQuery选项卡flash(FOUC)

我遇到了类似的情况,这就是我解决这个问题的方法：

(1.)定义一个名为“hide”的css类,并将其设置为“display：none”

(2.)在每个div中使用“contentpanel”类,在旁边添加“hide”
它在你的标记中.这将确保页面加载显示
没有,而不是等待javascript来处理它.

(3.)当你创建jquery.ui.tabs选择器时,使用
“tabscreate”方法从内容中删除“隐藏”类
面板.所以你的选择器看起来像这样：

//define tabs instance 
   $( "#tabs" ).tabs({

        create: function( event,ui ) {
           //when tabs are created,remove your class .hide from each content panel
           //so jquery tabs will control when panel content will surface
           $(your contentpanel SELEctor).removeClass(hidE);
        }
     //whatever else you need to do
     ....
     ...
     ..
    });

要了解有关jQuery UI选项卡内部方法的更多信息,请阅读：

http://api.jqueryui.com/tabs/

并阅读

创建(事件,用户界面)

希望这可以帮助.

克里斯