jQuery打印插件PrintArea實現jQuery打印插件PrintArea實現

實現javascript打印功能,打印整個頁面就很簡單,但如果指定打印某一個區域就有點難點,這裏有一個jQuery插件PrintArea可實現打印頁面某區域功能。

使用說明
需要使用jQuery庫文件PrintArea庫文件

使用方法
一,包含文件部分

1.                     <scripttype="text/javascript" src="jquery.js"></script>

2.                     <scripttype="text/javascript"src="jquery.PrintArea.js"></script>

二,html部分

1.                     <divid="biuuu_button">打印</div>

2.                     <divid="myPrintArea">

3.                     .....文本打印部分.....

4.                     </div>

三,javascript部分

1.                     $("div#biuuu_button").click(function(){

2.                     $("div#myPrintArea").printArea();

3.                     });

jQuery插件PrintArea完整方法如下:

1.                     (function($){

2.                     varprintAreaCount = 0;

3.                     $.fn.printArea= function()

4.                     {

5.                     varele = $(this);

6.                     varidPrefix = "printArea_";

7.                     removePrintArea(idPrefix + printAreaCount );

8.                     printAreaCount++;

9.                     variframeId = idPrefix + printAreaCount;

10.                 variframeStyle = 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;';

11.                 iframe= document.createElement('IFRAME');

12.                 $(iframe).attr({style : iframeStyle,

13.                 id   : iframeId

14.                 });

15.                 document.body.appendChild(iframe);

16.                 vardoc = iframe.contentWindow.document;

17.                 $(document).find("link")

18.                 .filter(function(){

19.                 return$(this).attr("rel").toLowerCase() == "stylesheet";

20.                 })

21.                 .each(function(){

22.                 doc.write('<linktype="text/css" rel="stylesheet" href="' +

23.                 $(this).attr("href")+ '" >');

24.                 });

25.                 doc.write('<divclass="' + $(ele).attr("class") + '">' + $(ele).html() +'</div>');

26.                 doc.close();

27.                 varframeWindow = iframe.contentWindow;

28.                 frameWindow.close();

29.                 frameWindow.focus();

30.                 frameWindow.print();

31.                 }

32.                 varremovePrintArea = function(id)

33.                 {

34.                 $("iframe#" + id ).remove();

35.                 };

36.                 })(jQuery);

jQuery插件PrintArea的庫代碼非常簡單,輕鬆實現javascript打印頁面某區域功能。

 


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章