欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

關(guān)于jQuery EasyUI 中刷新Tab選項(xiàng)卡后一個(gè)頁(yè)面變形的解決方法

 更新時(shí)間：2017年03月02日 09:44:28   作者：菜鳥(niǎo)葫蘆娃  
這篇文章主要介紹了關(guān)于jQuery EasyUI 中刷新Tab選項(xiàng)卡后一個(gè)頁(yè)面變形的解決方法,需要的朋友可以參考下

書(shū)寫jQuery EasyUI Tab 樣例時(shí),如果刷新前面的Tab 選項(xiàng)卡,某一個(gè)Tab 選項(xiàng)卡里面的頁(yè)面布局變亂。如下面圖片所示：

剛開(kāi)始打開(kāi)時(shí)頁(yè)面布局正確：

這里寫圖片描述
這里寫圖片描述 

此時(shí)我們?cè)诘诙€(gè)選項(xiàng)卡里面,點(diǎn)擊第一個(gè)頁(yè)面的刷新按鈕,一直刷新,然后切換回來(lái)再看看頁(yè)面,如下圖：

這里寫圖片描述 

但是首頁(yè)選項(xiàng)卡的頁(yè)面是正常的。

這里寫圖片描述 

為了便于解釋說(shuō)明,這里用第一個(gè)選項(xiàng)卡代表 “首頁(yè)”,第二個(gè)選項(xiàng)卡代表”子菜單10”

出現(xiàn)這種情況的問(wèn)題根本原因在于,你在第二個(gè)選項(xiàng)卡里面,點(diǎn)擊其它第一個(gè)選項(xiàng)卡刷新按鈕時(shí),其實(shí)刷新的時(shí)第二個(gè)選項(xiàng)頁(yè)面內(nèi)容,當(dāng)你鼠標(biāo)離開(kāi)你第一個(gè)選項(xiàng)卡刷新按鈕時(shí) ，此時(shí)才選中了第一個(gè)選項(xiàng)卡,而這時(shí)候第二個(gè)選項(xiàng)卡還沒(méi)有渲染完畢,才導(dǎo)致出現(xiàn)這樣的情況。驗(yàn)證過(guò)程,這是使用的是驗(yàn)證選項(xiàng)卡的title.

打開(kāi)兩個(gè)選項(xiàng)卡,一個(gè)”首頁(yè)”,一個(gè)”子菜單10”選項(xiàng)卡,切換到”子菜單10”選項(xiàng)卡,然后點(diǎn)擊”首頁(yè)”選項(xiàng)卡的刷新按鈕,彈出的結(jié)果如下的圖,可見(jiàn)在鼠標(biāo)點(diǎn)擊的過(guò)程中,tab 里面選中的還是”子菜單10”選項(xiàng)卡,并不是我們看到的”首頁(yè)”選項(xiàng)卡。

這里寫圖片描述

出現(xiàn)上圖問(wèn)題的錯(cuò)誤代碼如下:

/* title表示tab選項(xiàng)卡的標(biāo)題 */
function refeshCurrentTab() {
      var tabPanel = $('#tabContainer');//存放tab選項(xiàng)卡的容器
      var tab = tabPanel.tabs('getSelected');
      //alert("tab選項(xiàng)卡選中按鈕的title:"+tab.panel('options').title);      
      var url = $(tab.panel('options').content).attr('src');
      tabPanel.tabs('update', {
        tab: tab,
        options: {
          content: createFrame(url) //創(chuàng)建Frame標(biāo)簽
        }
      });
    };
   function createFrame(url) {
      return '<iframe src="' + url + '" frameborder="0" style="height:100%;width:100%;"></iframe>';
    };

找到問(wèn)題的根本所在,那么在上述方法中,只需要刷新時(shí)傳入刷新按鈕那個(gè)tab選項(xiàng)卡的標(biāo)題,選中這個(gè),然后再進(jìn)行刷新操作。修改的代碼如下:

/* title表示tab選項(xiàng)卡的標(biāo)題 */
    function refeshCurrentTab(title) {
      var tabPanel = $('#tabContainer');
      var tab = tabPanel.tabs('getSelected');
      //alert("傳入的參數(shù)title:"+title+",tab選項(xiàng)卡選中按鈕的title:"+tab.panel('options').title);      
      var refeshTab = tabPanel.tabs("getTab", title);
      if (tab != refeshTab) {
        tabPanel.tabs("select", title);
        tab = refeshTab;
      }
      var url = $(tab.panel('options').content).attr('src');
      tabPanel.tabs('update', {
        tab: tab,
        options: {
          content: createFrame(url)
        }
      });
    };
   function createFrame(url) {
      return '<iframe src="' + url + '" frameborder="0" style="height:100%;width:100%;"></iframe>';
    };

以上所述是小編給大家介紹的關(guān)于jQuery EasyUI 中刷新Tab選項(xiàng)卡后一個(gè)頁(yè)面變形的解決方法，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

相關(guān)文章

最新評(píng)論