在ASP.NET的server form 中使用easyui的layout布局控件

    easyui是一个轻量型的jQuery UI库，里面包含的控件在开发的过程中加快了开发速度，用起来也是很方便的;

    不过，在使用过程中发现，easyui的layout控件如果是运用在div标签上运行得很正常，但如果layout控件被form标签包围或是将其定义在form上使用则会出现不能自动布局的问题，例如

 

示例1：

<div class="easyui-layout">
....
<div region="center">...</div>
....
</div>

 

 改为

示例2：

<form class="easyui-layout">
....
<div region="center">...</div>
....
</form>

 

或

示例3：

<form>
<div class="easyui-layout">
....
<div region="center">...</div>
....
</div>
</form>

 

这个时候layout自动布局就会失效了，只会在页面加载时布局，而在拖动改变窗口大小时，将会保持原状，而不会随着窗口的大小伸缩而发生变化。

对于示例2，可通过对window的resize事件添加一个处理函数即可解决

 

代码1：
<script>
    $(function (){
        $(window).resize(function(){
            $("form.easyui-layout").layout("resize");
        }); 
    });
</script>