easyui+tree+tab解决重新加载

最新推荐文章于 2022-04-07 22:42:07 发布

月疯

最新推荐文章于 2022-04-07 22:42:07 发布

阅读量879

点赞数

分类专栏：【easyUI】

本文链接：https://blog.csdn.net/chehec2010/article/details/85038419

版权

【easyUI】专栏收录该内容

28 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Basic tree - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="../easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../easyui/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../easyui/demo/demo.css">
    <script type="text/javascript" src="../easyui/jquery.min.js"></script>
    <script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript">
        $(function(){
            $('#home-tree').tree({
                url : '/menuTree/selectMenuTrees'
            });
        });


    </script>
</head>
<body class="easyui-layout">
<div data-options="region:'north',border:false" style="height:60px;backgroud:#ff0000ff;padding:1px;text-align: center"title="seer管理系统">
</div>
<div data-options="region:'west',split:true" style="width:200px;padding:10px">
    <ul id='home-tree' ></ul>
</div>
<div  class="easyui-tabs" id="tb" data-options="region:'center'"></div>
<!--<div data-options="region:'north',border:false" style="height:60px;background:#B3DFDA;padding:10px">北部区域</div>-->
<!--<div data-options="region:'west',split:true,title:'西'" style="width:150px;padding:10px;">-->
    <!--<ul id='home-tree'></ul>-->
<!--</div>-->
<!--<div data-options="region:'east',split:true,collapsed:true,title:'东'" style="width:100px;padding:10px;">中部区域</div>-->
<!--<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;">南部区域</div>-->
<!--点击打开tab页面-->
<script type="text/javascript">

    $('#home-tree').tree({
        onClick: function(node){
            var url=node.attributes.url;
            var subtitle=node.text;
            addTab(url,subtitle);
        }
    });
    function addTab(url,subtitle){

        if(!$('#tb').tabs('exists',subtitle)){
             $("#tb").tabs("add",{
                title:  subtitle,
                content: createFrame(url),
                closable: true
            });
        }else{
            $('#tb').tabs('select', subtitle);
            var selTab = $('#tb').tabs('getSelected');
            $('#tb').tabs('update', {
                tab: selTab,
                options: {
                    content:createFrame(url)
                }
            });
        }
    }

function createFrame(url){
    return '<iframe src="' + url + '" frameborder=0 height=100% width=100% scrolling=no></iframe>';
}

</script>
<!--<div data-options="region:'center',title:'中'"></div>-->
</body>
</html>

已经成功可以运行，完全没问题！