展开全部
对于你说的 PrintArea 不太熟悉,不过之前在我网站上写了一段代码,主要是为了打印 <pre> 里面的内容,为了方便使用,现在把它写成了一个 prototype 形式的 jQuery 插件,支持当前 5 大浏览器。
【插件】
(function($) {
$.fn.printMe = function(text_only) {
// 获取元素内容
var content = text_only ? $(this).text() : $(this).html();
// 在页面创建 iframe
$("body").append('<iframe id="iframe-print" style="display: none;"></iframe>');
// 获取 iframe window
var ifrm = $("#iframe-print")[0].contentWindow;
// 将内容写入 iframe
ifrm.document.write(content);
// IE
if(navigator.userAgent.match(/MSIE/)) {
ifrm.document.execCommand("print", false, null);
}
// Opera
else if(navigator.userAgent.match(/Opera/)) {
// Opera 需要打开新窗口
var printWin = window.open(""), printDoc = printWin.document;
printDoc.open();
printDoc.write('<!DOCTYPE html><html><head></head><body onload="window.print(); window.close();">' + content + '</body></html>');
printDoc.close();
}
// Firefox/Chrome/Safari/其它浏览器
else {
ifrm.print();
}
// 释放 cache
ifrm = null;
// 移除 iframe
$("#iframe-print").remove();
};
})(jQuery);
【用法】
$( 要打印的元素 ).printMe( 只打印text选项 );
要打印的元素:指定 id 或 class,也就是你说的要打印的指定区域。
只打印text选项:如果指定为 true 或 1,将会把指定元素内的 html 全部忽略,也就是打印区域内的 .text()。默认为 false,也就是打印区域内的 .html()。
【实例 1】
$("#print_div").on("click", function() {
$("#div").printMe();
});
<div id="div"><p style="color: #f00;">文字段落</p><em>斜体文字</em></div>
<a id="print_div">打印 div 中的 html</a>
此例将打印 div 中的 p 和 em。
【实例 2】
$("#print_div_text").on("click", function() {
$("#div").printMe(1);
});
<div id="div"><p style="color: #f00;">文字段落</p><em>斜体文字</em></div>
<a id="print_div_text">打印 div 中的 text</a>
此例将忽略 div 中的 p 和 em,只打印 text。
【插件】
(function($) {
$.fn.printMe = function(text_only) {
// 获取元素内容
var content = text_only ? $(this).text() : $(this).html();
// 在页面创建 iframe
$("body").append('<iframe id="iframe-print" style="display: none;"></iframe>');
// 获取 iframe window
var ifrm = $("#iframe-print")[0].contentWindow;
// 将内容写入 iframe
ifrm.document.write(content);
// IE
if(navigator.userAgent.match(/MSIE/)) {
ifrm.document.execCommand("print", false, null);
}
// Opera
else if(navigator.userAgent.match(/Opera/)) {
// Opera 需要打开新窗口
var printWin = window.open(""), printDoc = printWin.document;
printDoc.open();
printDoc.write('<!DOCTYPE html><html><head></head><body onload="window.print(); window.close();">' + content + '</body></html>');
printDoc.close();
}
// Firefox/Chrome/Safari/其它浏览器
else {
ifrm.print();
}
// 释放 cache
ifrm = null;
// 移除 iframe
$("#iframe-print").remove();
};
})(jQuery);
【用法】
$( 要打印的元素 ).printMe( 只打印text选项 );
要打印的元素:指定 id 或 class,也就是你说的要打印的指定区域。
只打印text选项:如果指定为 true 或 1,将会把指定元素内的 html 全部忽略,也就是打印区域内的 .text()。默认为 false,也就是打印区域内的 .html()。
【实例 1】
$("#print_div").on("click", function() {
$("#div").printMe();
});
<div id="div"><p style="color: #f00;">文字段落</p><em>斜体文字</em></div>
<a id="print_div">打印 div 中的 html</a>
此例将打印 div 中的 p 和 em。
【实例 2】
$("#print_div_text").on("click", function() {
$("#div").printMe(1);
});
<div id="div"><p style="color: #f00;">文字段落</p><em>斜体文字</em></div>
<a id="print_div_text">打印 div 中的 text</a>
此例将忽略 div 中的 p 和 em,只打印 text。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询