`

<转>使用js打印局部页面

 
阅读更多
<script type="text/javascript">

///***********************

///打印指定区域页面

///说明:obj–通过getElementById或其它方式获取标签标识,打印此obj内的文字

///开发:王洪剑

///日期:2009-8-7

function startPrint(obj)

{

    var oWin=window.open("","_blank");

    var strPrint="<h4 style=’font-size:18px; text-align:center;’>打印预览区</h4>\n";

    

    strPrint=strPrint + "<script type=\"text/javascript\">\n";

    strPrint=strPrint + "function printWin()\n";

    strPrint=strPrint + "{";

    strPrint=strPrint +    "var oWin=window.open(\"\",\"_blank\");\n";

    strPrint=strPrint + "oWin.document.write(document.getElementById(\"content\").innerHTML);\n";

    strPrint=strPrint + "oWin.focus();\n";

    strPrint=strPrint + "oWin.document.close();\n";

    strPrint=strPrint + "oWin.print()\n";

    strPrint=strPrint + "oWin.close()\n";

    strPrint=strPrint + "}\n";

    strPrint=strPrint + "<\/script>\n";

    

    strPrint=strPrint + "<hr size=’1′ />\n";

    strPrint=strPrint + "<div id=\"content\">\n";

    strPrint=strPrint + obj.innerHTML + "\n";

    strPrint=strPrint + "</div>\n";

    strPrint=strPrint + "<hr size=’1′ />\n";

    strPrint=strPrint + "<div style=’text-align:center’><button onclick=’printWin()’ style=’padding-left:4px;padding-right:4px;’>打  印</button><button onclick='window.opener=null;window.close();'  style='padding-left:4px;padding-right:4px;'>关  闭</button></div>\n";

    oWin.document.write(strPrint);

    oWin.focus();

    oWin.document.close();

}

</script>



<button id="btnPrint" onclick="startPrint(document.getElementById(’content’))">打印内容</button>

<div id="content">

    <div style="font-size:12px;color:#333;">
     <p>
    这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内
   </p>
   <p>
容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容
   </p>
    </div>

</div>

 

 

也就是说获取要打印的内容 然后把这些内容放到新的窗口。然后新的窗口上会有打印按钮。只需把需要打印的内容最外层div添加个id就行。然后通过id获取。

分享到:
评论

相关推荐

    js iframe 打印 打印预览 页眉页脚的设置

    iframeDoc.body.innerHTML = '&lt;header&gt;这是页眉&lt;/header&gt;&lt;main&gt;打印内容&lt;/main&gt;&lt;footer&gt;这是页脚&lt;/footer&gt;'; ``` 4. 触发打印: 最后,通过调用`window.print()`方法,可以启动打印预览。为了确保iframe已经加载...

    Js打印功能,支持局部打印

    总的来说,"Js打印功能,支持局部打印"这一主题涵盖了JavaScript的打印API、CSS打印样式以及可能需要的第三方库的使用。开发者可以通过学习和实践这些样例,提升网页打印功能的用户体验,同时解决在复杂场景下的打印...

    JS实现页面打印(整体、局部)

    在网页开发中,JS提供了多种方法来实现页面的打印功能,包括整体打印和局部打印。以下是对这些方法的详细说明: ### 整体打印 整体打印最简单的方式是使用JavaScript的`window.print()`函数。当你点击一个链接或者...

    JAVA的Web打印方式(PageOffice、POI、jacob,html打印等)

    这种方式是最直接的,方便的,不需要加什么插件jar包,只要前台在一个div中模仿着报表的格式去设置界面布局,然后把数据动态的填充进去,再调用JavaScript打印函数,就可以实现界面的局部打印功能。如果不想让报表...

    js实现打印局部页面

    利用js代码实现文档部分打印功能 文档中除了doPrint 函数外 还有其它有用函数

    javascript学习文档.pdf

    JavaScript 可以以两种方式嵌入HTML:内联(直接在HTML中)和外部引用(通过`&lt;script src="hello.js" language="javascript"&gt;&lt;/script&gt;`引入JS文件)。另外,HTML元素的属性,如`onclick`,也可以直接调用JavaScript...

    jPrintArea的demo

    &lt;script src="jPrintArea.js"&gt;&lt;/script&gt; &lt;style&gt; .no-print { display:none; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;button id="printBtn"&gt;打印&lt;/button&gt; &lt;div id="printableArea"&gt; &lt;!-- 这里是你要打印的内容 --&gt; &lt;/...

    打印js方法

    &lt;button onclick="window.print()"&gt;打印页面&lt;/button&gt; ``` 当用户点击这个按钮时,浏览器会自动弹出打印预览,展示当前页面的内容。 然而,有时我们可能只需要打印页面的一部分,比如一个表格或一段特定的文字。这...

    二维码生成实例+局部打印

    2. JavaScript打印事件:监听`beforeprint`和`afterprint`事件,以便在打印前调整页面布局,打印后恢复原状。 3. HTML`&lt;canvas&gt;`元素:可以先将二维码绘制到`&lt;canvas&gt;`上,然后通过`canvas.toDataURL()`获取图片数据...

    jquery.PrintArea.rar

    《jQuery PrintArea插件:实现页面局部打印的详解与应用》 在网页开发中,有时候我们需要提供用户打印页面上的特定区域而不是整个页面。jQuery PrintArea插件正为此目的而设计,它允许开发者轻松地实现页面的局部...

    freemarker总结

    其它的运行符可以作用于数字和日期,但不能作用于字符串,大部分的时候,使用gt等字母运算符代替&gt;会有更好的效果,因为 FreeMarker会把&gt;解释成FTL标签的结束字符,当然,也可以使用括号来避免这种情况,如:&lt;#if (x&gt;y)&gt; ...

    页面实现预览和打印(页面整体打印和局部打印)

    本主题将详细探讨如何在HTML和JSP页面中实现这两种功能,包括整体页面的预览和打印以及局部元素(如表格和文档)的处理。 首先,我们需要理解基本的打印原理。在浏览器中,打印功能通常依赖于CSS样式控制,尤其是...

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

    JavaScript调用IFrame实现打印页面内容的方法是一种常见且实用的技术,尤其在网页中需要特定区域打印或者保持原页面不被改变的情况下。以下是该方法的详细解释: ### 1. 程序说明 1. **选择性打印**:此方法允许...

    js局部打印demo

    "js局部打印demo"是这样一个示例,它使用jQuery库来实现局部打印功能,并确保在中文环境下不出现乱码问题。下面将详细介绍这个知识点及其相关技术。 1. **JavaScript局部打印**: - JavaScript 提供了`window....

    使用javascript最简单的代码输出XML中的内容

    在实际开发中,我们还可以结合AJAX技术,实现页面的局部更新,提高用户体验。同时,对于现代浏览器,可以考虑使用`fetch` API,其语法更加简洁,返回Promise对象,可以更好地与async/await配合使用。 ```javascript...

    .net 页面指定区域打印的方法

    &lt;a href="javascript:window.print()" target="_self"&gt;打印&lt;/a&gt; ``` 这种方式简单且易于实现,适合于只需要对页面进行少量调整的情况。 #### 第二种方法:指定打印区域 当需要打印的是页面中的特定部分时,可以...

    jquery局部打印

    以下是如何使用`jquery.PrintArea.js`实现局部打印的步骤: 1. **引入jQuery库和PrintArea插件**:首先,确保在HTML文件中引入jQuery库和`jquery.PrintArea.js`。通常,这需要在`&lt;head&gt;`标签内添加链接到这些文件的...

    javascript

    第一种是将`&lt;script&gt;`标签放在`&lt;head&gt;`或`&lt;body&gt;`部分,直接在其中编写JavaScript代码,例如打印出"这是以JavaScript印出的!"。第二种方式是将`&lt;script&gt;`标签放在`&lt;head&gt;`中,这样JavaScript代码会在文档加载时执行...

Global site tag (gtag.js) - Google Analytics