发布网友
共2个回答
懂视网
<html> <head> <title>页面打印</title> <!--media=print 这个属性在打印时有效 有些不想打印出来的分页打印的都可以应用这类样式进行控制 在非打印时是无效的(可从打印预览中看到效果)--> <style media=print> /* 应用这个样式的在打印时隐藏 */ .noPrint { display: none; } /* 应用这个样式的,从那个标签结束开始另算一页,之后在遇到再起一页,以此类推 */ .page { page-break-after: always; } </style> <!-- 这个是普通样式 --> <style type="text/css"> .tab td { border-bottom: 1 solid #000000; border-left: 1 solid #000000; border-right: 0 solid #ffffff; border-top: 0 solid #ffffff; } .tab { border-color: #000000 #000000 #000000 #000000; border-style: solid; border-top-width: 2px; border-right-width: 2px; border-bottom-width: 1px; border-left-width: 1px; } .hr { font-family: "宋体"; font-size: 9pt; } </style> <script language="JavaScript" type="text/JavaScript"> var hkey_root, hkey_path, hkey_key; hkey_root = "HKEY_CURRENT_USER"; hkey_path = "//Software//Microsoft//Internet Explorer//PageSetup//"; //这个是用来设置打印页眉页脚的,你可以设置为空或者其它 try{ var RegWsh = new ActiveXObject("WScript.Shell"); hkey_key="header"; RegWsh.RegWrite(hkey_root+hkey_path+hkey_key, "&w&b页码,&p/&P"); hkey_key="footer"; RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,""); }catch(e){ alert(e.description()); } </script> </head> <body bgcolor="white"> <table cellspacing="0" cellpadding="0" width="100%" align="center" border="0"> <thead class="noPrint"> <tr> <td align="center" colspan="3"> <center class="NoPrint"> <OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 width=0></OBJECT> <input type=button value=打印 onclick=document.all.WebBrowser.ExecWB(6,1)> <input type=button value=直接打印 onclick=document.all.WebBrowser.ExecWB(6,6) /> <input type=button value=页面设置 onclick=document.all.WebBrowser.ExecWB(8,1) /> <input type=button value=打印预览 onclick=document.all.WebBrowser.ExecWB(7,1) /> <!-- 关于这个组件还有其他的用法,列举如下: WebBrowser.ExecWB(1,1) 打开 Web.ExecWB(2,1) 关闭现在所有的IE窗口,并打开一个新窗口 Web.ExecWB(4,1) 保存网页 Web.ExecWB(6,1) 打印 Web.ExecWB(7,1) 打印预览 Web.ExecWB(8,1) 打印页面设置 Web.ExecWB(10,1) 查看页面属性 Web.ExecWB(15,1) 好像是撤销,有待确认 Web.ExecWB(17,1) 全选 Web.ExecWB(22,1) 刷新 Web.ExecWB(45,1) 关闭窗体无提示 --> </center> </td> </tr> </thead> <tr> <td align="center" colspan="3" style="font-size: 24px"> <b>报告印章申请表</b> </td> </tr> <tr> <td align="left" colspan="2">编号:A002 </td> <td align="right"> </td> </tr> <tr> <td colspan="3"> <table class="tab" cellSpacing="0" cellPadding="0" width="100%"> <tr align="center" height="23"> <td width="10%" height="23"><b>编号</b></td> <td width="5%"><b>份数</b></td> <td width="12%"><b>项目/级别编号</b></td> <td width="12%"><b>单位</b></td> <td width="12%"><b>项目名称</b></td> <td width="12%"><b>工程地点</b></td> <td width="12%"><b>检测项目</b></td> <td width="7%"><b>单价</b></td> <td width="8%"><b>数量</b></td> <td width="10%"><b>总价</b></td> </tr> <tr style="font-size: 13px" align="center" height="23"> <td>A14785 </td> <td>5 </td> <td>A1546/75 </td> <td>中国广东广州 </td> <td>BRT工程 </td> <td>广州天河 </td> <td>BRT工程 </td> <td>¥999999999.99</td> <td>20 </td> <td>20*¥999999999.99 </td> </tr> <tr align="center" height="23"> <td colspan="2">备注</td> <td colspan="8"> </td> </tr> </table> </td> </tr> </table> <hr class="noprint" width="100%" size="2"/> <p class="page"></p> <table class="tab" cellSpacing="0" cellPadding="0" width="100%"> <tr align="center" height="23"> <td width="10%" height="23"><b>编号</b></td> <td width="5%"><b>份数</b></td> <td width="12%"><b>项目/级别编号</b></td> <td width="12%"><b>单位</b></td> <td width="12%"><b>项目名称</b></td> <td width="12%"><b>工程地点</b></td> <td width="12%"><b>检测项目</b></td> <td width="7%"><b>单价</b></td> <td width="8%"><b>数量</b></td> <td width="10%"><b>总价</b></td> </tr> <tr style="font-size: 13px" align="center" height="23"> <td>A14785 </td> <td>5 </td> <td>A1546/75 </td> <td>中国广东广州 </td> <td>BRT工程 </td> <td>广州天河 </td> <td>BRT工程 </td> <td>¥999999999.99</td> <td>20 </td> <td>20*¥999999999.99 </td> </tr> <tr align="center" height="23"> <td colspan="2">备注</td> <td colspan="8"> </td> </tr> </table> <p class="page"></p> <table class="tab" cellSpacing="0" cellPadding="0" width="100%"> <tr align="center" height="23"> <td width="10%" height="23"><b>编号</b></td> <td width="5%"><b>份数</b></td> <td width="12%"><b>项目/级别编号</b></td> <td width="12%"><b>单位</b></td> <td width="12%"><b>项目名称</b></td> <td width="12%"><b>工程地点</b></td> <td width="12%"><b>检测项目</b></td> <td width="7%"><b>单价</b></td> <td width="8%"><b>数量</b></td> <td width="10%"><b>总价</b></td> </tr> <tr style="font-size: 13px" align="center" height="23"> <td>A14785 </td> <td>5 </td> <td>A1546/75 </td> <td>中国广东广州 </td> <td>BRT工程 </td> <td>广州天河 </td> <td>BRT工程 </td> <td>¥999999999.99</td> <td>20 </td> <td>20*¥999999999.99 </td> </tr> <tr align="center" height="23"> <td colspan="2">备注</td> <td colspan="8"> </td> </tr> </table> </body> </html>
热心网友
页面在初始化加载数据较多时会非常耗时,如果只加载表格,用户再根据自己的需要通过条件查询数据,就会节约一些时间,提高用户体验,所以在初始化datagrid时想只加载表格不加载数据,做到数据与表格加载分离的效果。
经过实验发现,使用.datagrid()方法时,参数中只要有URL存在,都会自动调用一次加载数据,可设置url参数为null,则加载表格时就不会向后台发出请求;但是此时如果用户想重置页面条件,重新加载页面时,由于没有请求后台,只加载表格,则会发生页面条件清空,表格数据还在或者表格数据为空分页展示的记录却不为0的现象,所以也需要重置数据和分页参数,具体代码如下:
[javascript] view plain copy
/**
* dataGrid初始化表格
* @param id datagrid的id
* @param column 展示的列名
* @param opt 设置自定义datagrid属性
*/
function commonInitDataGrid(id, column, opt){
var initData =
{
"code":100,
"msg":"",
"data":{"totalDataCount":0,"totalPageCount":0,"list":[],"properties":{"footer": []}}
};
//校验参数
if(isEmpty(id) || isEmpty(column)){
jQuery.messager.alert("系统提示", "系统错误,请联系技术人员!");
return;
}
//默认属性
var defaultOpt= {
"url": null,
"method": 'POST', //请求方式
"columns": column,
"width": document.body.clientWidth < 756 ? 756 - 18 : document.body.clientWidth - 18,
"remoteSort": false,
"rownumbers": true,
"pagination": true,
"showFooter": true,
"fitColumns": true,
"pageNumber": 1,
"pageSize": 20,
"pageList": [10, 20, 30, 50, 100],
"singleSelect": true,
"striped": true,
"loadFilter": function (result) {
if (result.code == "100") {
//解析json结果集,返回给datagrid
var obj =
{
"total": result.data.totalDataCount,
"rows": result.data.list,
"footer": result.data.properties.footer
};
return obj;
} else {
jQuery.messager.alert("系统提示", result.msg);
return false;
}
}
}
if(!isEmpty(opt)){
//替换自定义属性
$.extend(defaultOpt, opt);
}
//把属性与事件放到表格中,进行初始化
$("#" + id).datagrid(defaultOpt);
$("#" + id).datagrid('loadData', initData);
}
说明:1.设置URL为null后,则每次调用此方法都只会加载表格,不加载数据,调用此方法时就不需要再调用此方法之前设置URL了;
2.pageSize的参数不在pageList之中时,页面分页会默认取pageList中的第一个参数,此时pageSize设置无效。
3.loadFilter方法是为了处理后台返回的结果,并自动传给datagrid进行处理然后展示在页面