关于EasyUI的Layout总结

版权声明：本文为博主原创文章，未经博主容许不得转载。

一、layout以html标签方式创建的

<div id="content" region="center" border="false" class="easyui-layout">

                    <div id="divPage1"
                        data-options="region:'west'"
                        style="width: 150px;"></div>
                    <div id="divPage2"
                        data-options="region:'center',href:'${basePath}/userManage_main.jspx'"></div>

                </div>

这样，若是我想从新修改 div id="divPage1"这个layout的href属性，应该怎么实行？

实现方法：

$("#divPage1").panel({region:'west',href:'${basePath}/userManage_left.jspx?width='+width});
$("#divPage1").panel('refresh');

必须执行panel的‘refresh’方法才会生效，所以这个‘userManage_left.jspx’页面会被执行2次。目前个人解决办法是使用js脚本创建的方式来解决。

 

二、用js脚本方式创建的

先创建一个div标签，用于生成layout。

 

<div id="content" />

 

js脚本建立

 

$('#content').layout('add',{
                    region: 'west',
                    width: 180,
                    title: 'West Title',
                    split: true,
                    href:'${basePath}/userManage_left.jspx?width='+width,
                    tools: [{
                        iconCls:'icon-add',
                        handler:function(){alert('add')}
                    },{
                        iconCls:'icon-remove',
                        handler:function(){alert('remove')}
                    }]
                });
                $('#content').layout('add',{
                    region: 'center',
                    width: 580,
                    title: 'center Title',
                    split: true,
                    href:'${basePath}/userManage_main.jspx',
                    tools: [{
                        iconCls:'icon-add',
                        handler:function(){alert('add')}
                    },{
                        iconCls:'icon-remove',
                        handler:function(){alert('remove')}
                    }]
                });