现在的位置: 首页 > easyui > Layout > layout > 正文
扩展layout的方法,支持动态添加删除块
2012年01月30日 layout ⁄ 共 1224字 评论数 1 ⁄ 被围观 5,964 views+
文章目录
[隐藏]

jQuery easyui的layout没有提供动态增加或者删除某个区域的接口,在某些特殊场合下,可能显得有些不怎么灵活,不过因为easyui留了很好的扩展方式,实现起来并不困难,以下内容转自easyui学习班

实现代码:

$.extend($.fn.layout.methods, {  
    remove: function(jq, region){  
        return jq.each(function(){  
            var panel = $(this).layout("panel",region);
            if(panel){
                panel.panel("destroy");
                var panels = $.data(this, 'layout').panels;
                panels[region] = $('>div[region=' + region + ']', $(this));
                $.data(this, 'layout').panels = panels;
                $(this).layout("resize");
            }
        });  
    },
    add:function(jq, params){
        return jq.each(function(){  
            var container =$(this);
            var panel = $('>div[region=' + params.region + ']', container);
            if(!panel.length){
                var pp = $('<div/>').attr("region",params.region).addClass('layout-body').appendTo(container);
                var cls = 'layout-panel layout-panel-' + params.region;
                pp.panel($.extend({},params.options,{
                    cls : cls
                }));
                var panels = $.data(this, 'layout').panels;
                panels[params.region] = pp;
                $.data(this, 'layout').panels = panels;
                $(this).layout("resize");
            }
        });
    }
});

使用方法:

$('#layout').layout('remove','north');
 $('#layout').layout('add',{
            region:'north',
            options:{
                height:33
            }
        });

更新日志(2012-05-10)

jQuery easyui 1.2.6版本已经提供这两个方法,使用1.2.6的同学无需再扩展。

目前有 1 条留言 其中:访客:0 条, 博主:0 条 引用: 1

    给我留言

    留言无头像?


    ×