注册 | 登录 忘记密码？ 51cto首页 | 博客 | 论坛 | 招聘
热点文章 《网络规划设计师教程》..
　帮助
文章文章列表>>
2008-07-10 15:20:08



2008-03-14 10:28:42



2008-02-29 14:39:28



2008-02-27 14:26:34



2008-02-27 14:25:10



2007-12-27 19:27:50


类别：未分类 | 阅读全文(740) | 回复(2)      

2007-11-27 16:33:48



2007-11-08 09:24:20
近日，一个朋友让我帮忙实现一个功能：就是打印web页面的时候，只打印页面的内容，而不打印页面内控件、按钮等。
  如图：1-页面打印需求
 
  开始，我想这么实现：再点打印时，将控件的边框隐藏起来。但是，发现实际做起来会比较麻烦。比如：select控件就很难处理。

  于是，决定还是用最简单的办法：页面隐藏。 即做一个符合打印要求的页面隐藏在页面中。

  替换前的内容命名为A：，替换后的内容命名为B。打印的时候，将B显示，并把A隐藏起来。

  但是，需要注意的时，要实时的将A中的内容，复制到B中，以保证数据的统一。

例如：
<body >
<!-- 默认显示的页面--替换前的页面 -->
<table id = "a" class ="active">
  <!-- this is code -->
</table>

<!--打印时符合要求的页面--替换后的页面-->
<table id = "b" class = "inactive">
  <!-- this is code -->
</table>
</body>

下面为需要用到的CSS:
<!-- 显示内容style -->
.active
{
display: block;
}
<!-- 隐藏内容style -->
.inactive
{
display: none;
}
<!-- 符合打印格式 控件的style -->
.printStyle
{
border-bottom-color:blue;//控件的下部边框颜色
border-top-width: 0;   //隐藏控件的上部边框
border-left-width: 0; //隐藏控件的左部边框
border-right-width: 0; //隐藏控件的右部边框
}
隐藏页面中控件都使用text，然后都使用“printStyle”格式即可。
<input name="name_print" type="text"   id="id_print" class= "printStyle">

附件为一个简单的测试页面。

 [/img]..



2007-11-07 16:56:27



2007-11-07 16:35:28



2007-10-29 08:46:46



2007-10-12 10:37:05



2007-10-10 15:08:40



2007-09-28 13:33:05



2007-09-18 17:32:53



 <<   1   2   3   >>   页数 ( 1/3 )