jquery easyui tabs的刷新问题

最新推荐文章于 2020-08-05 11:01:47 发布

原创最新推荐文章于 2020-08-05 11:01:47 发布 · 4w 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#tabs #jquery #iframe #url

jquery 专栏收录该内容

13 篇文章

订阅专栏

在开发中遇到jQuery EasyUI Tabs的刷新问题，最初尝试通过关闭再新建tabs来实现首页刷新，但这会导致首页tab被推至最后。解决方法是使用tabs的update方法，先选择要更新的tab，然后传递新的内容选项，从而实现在不改变tabs顺序的情况下刷新首页内容。同时，注意到使用href会导致页面加载两次，所以改用content配合iframe来加载页面。

做一个首页自定义的功能，刚开始不知道如何刷新tabs。

采用的是先关闭，再新建。

$("#"+tabPanel).tabs('close','首页');

新建：

$("#"+tabPanel).tabs('add',{ title:tabTitle, style:{padding:'1px'}, //href:URL, // 使用href会导致页面加载两次，所以使用content代替 content:'<iframe name="indextab" scrolling="auto" frameborder="0" style="width:100%;height:100%;"></iframe>', closable:false, fit:true, selected:true }); window.open(URL,"indextab");

这样虽然可以实现，但是造成的结果是如果有其他打开的tab，首页就会排在后面。

后来通过查找tabs的方法。

用update可以实现：

$("#"+tabPanel).tabs('select',"首页"); var tab = $('#'+tabPanel).tabs('getSelected'); $("#"+tabPanel).tabs('update',{ tab:tab, options:{ title:tabTitle, style:{padding:'1px'}, //href:URL, // 使用href会导致页面加载两次，所以使用content代替 content:'<iframe name="indextab" scrolling="auto" frameborder="0" style="width:100%;height:100%;"></iframe>', closable:false, fit:true, selected:true } }); window.open(URL,"indextab");