功能主要有:
1.ajax分页,可设定每页显示数量,保存cookie,不足空行填充,隔行换色,独行点击高亮,突显行号,自定义跳转页。
2.查找,配置要查找的属性,可单属性查找,全属性查找,多个时间区间查找,查找结果显示效果与ajax请求一致
3.排序,全部属性列排序,数字字段排序,本地汉字排序,升降序切换
4.实现上述功能你无需任何JavaScript代码,只需按特定的格式写html代码即可。
?
html代码如下:
?
?
<%@ page language="java" pageEncoding="UTF-8"%> <html> <head> <link rel="stylesheet" href="/test2/css/my.css" type="text/css" media="screen" /> </head> <body> <div class="Big"> <div class="toolBar"> <div style="float:left;font-size:12px;"> <select id="listColumn" name="listColumn" style="float:left;"> <option value="1">显示所有记录</option> <option value="num">编号</option> <option value="name">监测方法</option> <option value="fromTime">发布日期</option> <option value="valid">有效年限</option> <option value="issue">发布单位</option> <option value="" selected="selected">所有列中查找</option> </select> <input type="text" id="SearchStr" name="SearchStr"> <input type="text" id="time1" name="time1" class="Wdate" onfocus="WdatePicker({skin:'whyGreen'})" style="display:none;"> <input type="text" id="time2" name="time2" class="Wdate" onfocus="WdatePicker({skin:'whyGreen'})" style="display:none;"> <a href="#" id="SIMsearch"><img src="/test2/images/search.png"/></a> <a href="#" id="SIMsearch1" style="display:none;"><img src="/test2/images/search.png"/></a> </div> <div style="float:right;font-size:12px;"> <a href="#" id="addBut"><img src="/test2/images/add.png"/>新增</a> <span id="whosPage" style="display:none;">monitorMethod</span> <span id="openWidth" style="display:none;">450</span> <span id="openHeight" style="display:none;">300</span> <span id="hasTimeSearch" style="display:none;">fromTime</span> </div> </div> <div class="containDate"> <table class="dateView" id="tt"> <thead> <tr style="position:relative; top:expression(this.offsetParent.scrollTop);"> <th width="3%"></th> <th width="11%" tName="num">编号</th> <th width="18%" tName="name">监测方法</th> <th width="15%" tName="fromTime">发布日期</th> <th width="10%" tName="valid">有效年限</th> <th width="23%" tName="issue">发布单位</th> <th width="20%">操作</th> </tr> </thead> <tbody id="tDate"> </tbody> </table> </div> <%@include file="/page.jsp" %> </div> </body> </html>
?
?
只适合不会做界面,而又需要快速开发的学生做毕业设计使用~
?