js或jquery实现页面打印可局部打印

js或jquery实现页面打印(局部打印)

1、js实现（可实现局部打印）


代码如下:

<html>
<title>js打印</title>
<head></head><body>
<input id="btnPrint" type="button" value="打印" onclick="javascript:window.print();" />

<input id="btnPrint" type="button" value="打印预览" onclick=preview(1) />
<style type="text/css" media=print>
.noprint{display : none }
</style>

<p class="noprint">不需要打印的地方</p>

<script>
function preview(oper)
{
if (oper < 10)
{
bdhtml=window.document.body.innerHTML;//获取当前页的html代码
sprnstr="<!--startprint"+oper+"-->";//设置打印开始区域
eprnstr="<!--endprint"+oper+"-->";//设置打印结束区域
prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html

prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html
window.document.body.innerHTML=prnhtml;
window.print();
window.document.body.innerHTML=bdhtml;
} else {
window.print();
}
}
</script>
<p>XXXXX</p>
<!--startprint1-->要打印的内容<!--endprint1-->
</body>
</html>

2、调用windows底层打印，报安全警告，不建议使用（不支持局部打印）


代码如下:

<HTML>
<HEAD>
<TITLE>javascript打印-打印页面设置-打印预览代码</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312" />
<SCRIPT language=javascript>
　　function printsetup(){
　　// 打印页面设置
　　wb.execwb(8,1);
　　}
　　function printpreview(){
　　// 打印页面预览
　　　　
　　wb.execwb(7,1); 　　　　　
　　　　
　　}

　　function printit()
　　{
　　if (confirm('确定打印吗？')) {
　　wb.execwb(6,6);
　　}
　　}
　　</SCRIPT>
</HEAD>
<BODY>

<DIV align=center>
<OBJECT id=wb height=0 width=0
classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 name=wb></OBJECT>
<INPUT onclick=javascript:printit() type=button value=打印 name=button_print />
<INPUT onclick=javascript:printsetup(); type=button value=打印页面设置 name=button_setup />
<INPUT onclick=javascript:printpreview(); type=button value=打印预览 name=button_show />
一按开始的减肥了卡时间段
</DIV>
</BODY>
</HTML>

3、jQuery实现（支持局部打印）


代码如下:

<html>
<head>
<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script>
$(function(){
$("input#biuuu_button").click(function(){
$("div#myPrintArea").printArea();
});
</script>
</head>
<body>
<input id="biuuu_button" type="button" value="打印"></input>
<div id="myPrintArea">.....文本打印部分.....</div> <div class="quote_title">引用</div><div class="quote_div"></div>
</body>
</html>

赞 (0)

相关推荐

  • Javascript打印局部页面实例

    代码如下,简单实用.因为需要用到这个东西,所以很无耻的拾人牙慧,收藏一下. <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript&qu

  • js调用iframe实现打印页面内容的方法

    1.程序说明 1) 此程序可以实现选择页面中的区域进行打印,以iframe方式进行打印:2) 与原生态的print() 区别在于,取消打印页面后可以完整保留当前访问页面的内容. 2.代码部分 1) JS 函数: 复制代码 代码如下: function do_print(id_str)//id-str 打印区域的id{var el = document.getElementById(id_str);var iframe = document.createElement('IFRAME');var

  • JS实现页面打印（整体、局部）

    我们在网页开发过程中经常会有打印页面的需求,通过JS来实现的方法有很多,这里我做了一个整理,供大家参考. 方式一:window.print() 整体打印 <a href="javascrīpt:window.print()" rel="external nofollow" target="_self">打印</a> 现在就轻松实现了页面的打印,但是这种方式会将整个页面打印,如果想要实现指定区域的打印需要通过下面的设置 局部

  • js实现局部页面打印预览原理及示例代码

    最近有朋友问js 如何打印预览,今天就来讲解一下,首先了解一下打印原理,其实局部打印页面很简单.就是把你需要打印的部分做一个起始标记,至于标记如何写,随便你写什么.我这里就写 <!--startprint--> 需要打印的内容 <!--endprint-->. 因为标记是不需要让用户看见的所以加了注释!具体实现代码如下: <!DOCTYPE html> <html> <head> <title>打印预览简单实现</title&g

  • 用javascript实现页面打印的三种方法

    前一段时间听朋友说起过打印网页的一些方法,在安静的夜晚,听着歌曲无意间发现了几段代码,帖出来跟大家分享一下. 因为我从来没有打印过网页,而且也没有打印机,具体的效果也不是很清楚,测试打印成PDF是正常的,就第二种在弹出设置窗口比第一跟第三种方法多了点. 注意:第二种方法的控件需要IE5.5+的支持,而且因为使用了控件,如果客户端IE的安全性设置过高,将无法正常运行.  特别提示  运行本例代码,如果已经安装了打印机,将直接调用打印机打印页面,否则提示安装打印机. 1.用window对象的prin

  • javascript 局部页面打印实现代码

    javascript 局部页面打印实现代码

    ie自带的有Active控件,但火狐不支持.这里使用的是js操作dom方法对窗体指定标记内文字进行打印,所以使用时需要定义相关的标签及其样式(文字大小.字体之类). 复制代码 代码如下: <script type="text/javascript"> ///*********************** ///打印指定区域页面 ///说明:obj–通过getElementById或其它方式获取标签标识,打印此obj内的文字 ///日期:2009-8-7 function s

  • javascript打印大全(打印页面设置/打印预览代码)

    复制代码 代码如下: <HTML><HEAD><TITLE>javascript打印-打印页面设置-打印预览代码</TITLE> <META http-equiv=Content-Type content="text/html; charset=gb2312" /> <SCRIPT language=javascript> function printsetup(){ // 打印页面设置 wb.execwb(8,1

  • 利用javascript实现web页面中指定区域打印

    最近做到了web页面课程表打印时,上网找了一些资料,最后使用了下面的方法实现了我需要的功能.将需要打印的课程表的table放入div标签中,然后指定出需要打印的区域,最后调用window.print打印指定内容. 示例代码(代码中有些内容已省略) 复制代码 代码如下: function preview() {    bdhtml = window.document.body.innerHTML;    sprnstr = "<!--startprint-->";    ep

  • js实现页面打印功能实例代码(附去页眉页脚功能代码)

    复制代码 代码如下: <html> <head></head> <style type="text/css" media="screen"> @media print{ .print {display:block;} .notPrint {display:none;} } </style> <script language="javascript"> function pre

  • JS实现页面打印功能

    打印整个页面 示例1. 可直接在按钮添加调用打印方法: <input type='button' value='打印整页' onclick='javascript:window.print();' /> 示例2. 也可调用JS方法 <html> <head> <script type="text/javascript"> function printpage() { window.print() } </script> <

随机推荐