该类页面通常的展示形式如下：  * 当点击查询按钮时执行相关的查询操作，然后将返回的数据填充到下面的表格中； * 同时，表格中还包含新建按钮和对应每条记录的详情按钮； * 有时候，该页面中的某些查询字段还需要进行预先初始化，以准备相关的数据，例如上面的“机构”字段。 因此，可以总结出此类页面的几个基本函数（以p001_为例） * showOrgs()：机构字段的初始化函数 * p001_searchUser()：点击查询按钮后执行的回调函数 * p001_getDetail(id)：点击新建或详情按钮后执行的回调函数 这里需要解释的是showOrgs函数之所以没有添加p001_前缀，是因为这是个通用的字段填充类函数，因此可以将这个函数放在common.js中，而不是放在页面对应的js中。 在html页面中将这几个函数分别添加到合适的位置： showOrgs函数放在customselect组件的data-init属性中 ``` <input id="superiorID" placeholder="全部" data-title="机构" data-type="awf-customselect" data-width="col-lg-5" data-init="showOrgs()"> ``` p001_searchUser函数放在button组件的data-callback属性中 ``` <button data-type="awf-button" data-callback="p001_searchUser()">查询</button> ``` 对于表格的生成，组件库提供了一个便利函数`AWFCommon.table()`，利用该函数可用很容易地生成表格，具体用法参考[H5组件库公共函数库](http://121.40.133.218/docs/app/commonfunc.html#func-table)。 p001_getDetail函数需要放在两个地方，一个是table组件的addNew按钮，另一个是详情超链接中，其中第一个可在html页面中添加 ``` <table id="userInfo" data-type="awf-table" data-title=' ' data-extbtn='addNew' data-addNew-callback='p001_getDetail(0);'> ``` 这里参数0的意思就是新建，否则就是显示对应编号的详情。 另一个需要在p001_searchUser函数中动态生成 ``` tabStr += td(dispActive(activeFlag,userID) +'&nbsp;&nbsp;' +'<a class="orange" href="javascript:p001_restPass('+ userID +')">重置密码 </a>&nbsp;&nbsp;' +'<a class="orange" href="javascript:p001_getDetail('+ userID +')">详情 </a>'); ``` 最后给出一个p001_getDetail函数的标准实现 ``` function p001_getDetail(ID){ $.cookie('userID', ID); goPage("UserDetail.htm"); } ``` 这里利用cookie来实现页面间参数的传递，即在页面进行跳转之前将参数保存到cookie中，然后在跳转后的页面再从cookie中将参数取出来。