项目中有时候前台表格显示字段过多，就好出现有些字段被隐藏，看不到的情况。easyUI就有个非常有用的属性forzen，定义某些字段frozen为true时，
则这些字段被冻结，其他的则可以拖动。页面会出现滚动条（不被冻结的字段），推动滚动条则可查看其他字段。
例子：
1 <%@ page language="java" contentType="text/html; charset=UTF-8"
2 pageEncoding="UTF-8"%>
3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
4 <html>
5 <head>
6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
7 <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/jquery-easyui-1.3.3/themes/default/easyui.css">
8 <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/jquery-easyui-1.3.3/themes/icon.css">
9 <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/jquery-easyui-1.3.3/demo/demo.css">
10 <script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.3.3/jquery.min.js"></script>
11 <script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
12 <script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script>
13 <script type="text/javascript">
14
15
16 function searchCustomer(){
17 $("#dg").datagrid(‘load‘,{
18 "khno":$("#s_khno").val(),
19 "name":$("#s_name").val()
20 });
21 }
22
23 </script>
24 <title>Insert title here</title>
25 </head>
26 <body style="margin: 1px">
27 <table id="dg" title="客户信息查询" class="easyui-datagrid"
28 pagination="true" rownumbers="true"
29 url="${pageContext.request.contextPath}/customer/list.do" fit="true" toolbar="#tb">
30 <thead data-options="frozen:true"><!--以下七个被固定，其他的可拖动 -->
31 <tr>
32 <th field="cb" checkbox="true" align="center"></th>
33 <th field="id" width="50" align="center" hidden="true">编号</th>
34 <th field="khno" width="150" align="center">客户编号</th>
35 <th field="name" width="200" align="center">客户名称</th>
36 <th field="cusManager" width="100" align="center">客户经理</th>
37 <th field="level" width="100" align="center">客户等级</th>
38 <th field="phone" width="100" align="center">联系电话</th>
39 </tr>
40 </thead>
41 <thead>
42 <tr>
43 <th field="area" width="80" align="center">客户地区</th>
44 <th field="myd" width="80" align="center">客户满意度</th>
45 <th field="xyd" width="80" align="center">客户信用度</th>
46 <th field="address" width="200" align="center" >客户地址</th>
47 <th field="postCode" width="100" align="center" >邮政编码</th>
48 <th field="fax" width="100" align="center" >传真</th>
49 <th field="webSite" width="100" align="center" >网址</th>
50 <th field="yyzzzch" width="100" align="center" >营业执照注册号</th>
51 <th field="fr" width="100" align="center" >法人</th>
52 <th field="zczj" width="100" align="center" >注册资金(万元)</th>
53 <th field="nyye" width="100" align="center" >年营业额(万元)</th>
54 <th field="khyh" width="100" align="center" >开户银行</th>
55 <th field="khzh" width="100" align="center" >开户帐号</th>
56 <th field="dsdjh" width="100" align="center" >地税登记号</th>
57 <th field="gsdjh" width="100" align="center" >国税登记号</th>
58 </tr>
59 </thead>
60 </table>
61 <div id="tb">
62 <div>
63 客户编号： <input type="text" id="s_khno" size="20" onkeydown="if(event.keyCode==13) searchCustomer()"/>
64 客户名称： <input type="text" id="s_name" size="20" onkeydown="if(event.keyCode==13) searchCustomer()"/>
65 <a href="javascript:searchCustomer()" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</a>
66 </div>
67 </div>
68
69 </body>
70 </html>
时间： 2024-10-12 23:56:53