js打印自身代碼（js如何打印）

本文目錄一覽：

• 1、JS-打印word的程序
• 2、js得到的數據如何打印出來
• 3、使用Javascript怎樣自動打印頁面
• 4、點擊打印控件 打印整個頁面 js代碼怎麼實現
• 5、js腳本打印的問題 代碼如下 window.onload=function print（）｛ wi

JS-打印word的程序

JS-打印word的模板程序

我們在做項目中經常遇到「打印表格」的功能，在此介紹一下我所用過的打印方法。

一、比較簡單的做法，word另存轉化為html文件的方式。分析如下：

1、首先我們需要在office中用wrod畫好文件的模板，然後將其另存為thm網頁形式。

2、將其改為jsp頁面，這樣我們就可以文件中使用後來傳過來的變量值。此時就是我們傳統的jsp方式，後台定義參數，然後前台獲取，將變量值寫在我們需要顯示的地方。

3、對於表格，我們可以用循環來控制。

4、這樣做打比較簡單，缺點word模板不能修改，一旦表格做個微小的變化，那我們的工作量也不小，因為word轉化後的代碼很難讀懂，要在代碼上控制其樣式，是相當的困難，所以不推薦這種做法。

（註：1、 在做模板時，我們可以先在需要顯示變量值的地方首先定義好值，然後在jsp中直接替換就行。

2、在jsp頁面中，在首先加入「%@ page contentType=”application/msword;charset=UTF-8″%」， 以標識此頁面為word文件。

3、如果需要點擊時直接打開word文件，而非彈出「保存、打開」對話框，則需要刪除「xmlns:w=”urn:schemas-microsoft-com:office:office”」代碼即可。

下面我們介紹另一種更常用的方法，此方法的有點是：修改word模板文件，不會影響程序。

二、用JS控制的打印方式，具體如下：

1、首先畫word模板，在需要動態顯示內容的地方插入「標籤」。方法如下：在word中，選中需要被替換的內容–插入–書籤，為其定義好名字即可，其它類似。

2、將做好的模板文件另存為模板dot文件。

做到這基本就差不多了，接下來就是後台代碼發揮的時候了。

3、在後台封裝參數值。

4、調用JS函數打印。

為了更為直觀的介紹，下面用一完整的例子介紹。

先把代碼貼出來：

1、JS模板文件，適用範圍：

a. 根據文檔文件，所有要顯示的內容都定義為書籤。

b. 純表格文件。如果為多個表格或表格中嵌套表格，則需要稍加修改。

c. 文檔、表格混搭型。

代碼如下：

/** * 得到 文件模板的目錄 * @param {} fileName * @return {} */ function getFileTemplatePath(fileName){ var path = “/page/printTemplate/” + fileName + “.dot”; var url=”http://”+window.location.hostname + “:” + window.location.port+ this.getContextPath() + path; return url; } /** * 調出word模板，並為標籤賦值 * @param {} jsonObj json對象 * @param {} fileName 所要打開的word文件名 */ function printWord(jsonObj,fileName){ var word=new ActiveXObject(“Word.Application”); word.Visible=true; var url= this.getFileTemplatePath(fileName); word.Documents.add(url) for(i=0;ijsonObj.length;i++){ if ((jsonObj[i].text)!=”list”){ range=word.ActiveDocument.Bookmarks(jsonObj[i].text).Range; range.text=jsonObj[i].value; }else{ var myTable=word.ActiveDocument.Tables(1); var rowsCount = myTable.Rows.Count; var iRow=2; for(j=0;jjsonObj[i].value.length;j++){ if (iRow rowsCount){ myTable.Rows.Add(); } var length = jsonObj[i].value[j].length; for(var k=0; klength; k++){ myTable.Rows(iRow).Cells(k + 1).Range.Text=jsonObj[i].value[j][k].value; } iRow ++; } } } word.Visible=true; }

2、看到代碼就會明白，這段代碼需要一個JSON類型的參數。

下一步我們所做的工作就是要在JSON上做文章了。 附後台代碼（封裝JSON，java)

類：PrintJSONObjectSet

import org.json.JSONArray; import org.json.JSONObject; public class PrintJSONObjectSet { private JSONArray ja; public PrintJSONObjectSet(){ ja = new JSONArray(); } public JSONArray getJSONArray(){ return ja; } public JSONObject json(Object key, Object value) throws Exception{ JSONObject jo = new JSONObject(); value = “”.equals(value) || value == null “” : value; jo.put(“text”, key); jo.put(“value”, value); return jo; } public void put(Object key, Object value) throws Exception{ ja.put(json(key,value)); } public void put(Object obj){ ja.put(obj); } }

打印封裝的方法：

/** * 打印出國(境)證明 * @return * @throws Exception */ public String printChuGuoJingZhengMing() throws Exception{ JSONArray ja = new JSONArray(); GroupInfo group = this.getGroupInfo(); String[] countrys = this.getCountrys(); if(countrys != null){ for(int c=0; ccountrys.length; c++){ PrintJSONObjectSet js = new PrintJSONObjectSet(); SeedGroupRef seed = seedImpl.getCzcz(getGroupInfoId(),countrys[c]); js.put(“year”, seed.getFileYear()); js.put(“fileNum”, seed.getFileNum()); js.put(“leader”,group.getLeader()); js.put(“groupCount”, group.getGroupCount()); js.put(“country”,countrys[c]); js.put(“dispCode”,getDispCode()); js.put(“printYear”, DateFunc.getPrintYear()); js.put(“printMonth”, DateFunc.getPrintMonth()); js.put(“printDay”, DateFunc.getPrintDay()); PrintJSONObjectSet js2 = new PrintJSONObjectSet(); ListMemberInfo memberList = this.getIsSefMembers(); MemberInfo member; for(int i=0; imemberList.size(); i++){ PrintJSONObjectSet js3 = new PrintJSONObjectSet(); member = memberList.get(i); js3.put(“name1”,member.getName()); js3.put(“passportNum1”,member.getPassportNum()); if(++i memberList.size()){ member = memberList.get(i); js3.put(“name2”,member.getName()); js3.put(“passportNum2”,member.getPassportNum()); } js2.put(js3.getJSONArray()); } js.put(“list”, js2.getJSONArray()); ja.put(js.getJSONArray()); } } PrintWriter out; System.out.println(ja.toString()); try{ out = response.getWriter(); out.print(ja.toString()); out.close(); }catch(Exception e){ e.printStackTrace(); } return null; }

對於JSON的說明：

1、最外層為一個JSONArray，這個JSON中包含多個JSONArra，其控制文檔的數量。

2、在第二層JSONArray中，包含多個JSONObject。其中每個JSONObject包含一個JSONObject對象。

每個JSONObject對象以{“text”:”name”,”value”:”張三”}的形式存儲。

3、遇到表格時，則在第二個JSONArray中，封裝類型{“text”:”list”,”value”:[[{“text”:””,”value:””}]]}形式。

也就是說此時的JSONObject的值必須為list,只有這樣，JS中才能將其作為表格來輸入。

其中在名為 list 的JSONObject對象中，包含多個JSONArray，用來控制行數。

每個JSONArray中包含多個類型第2條中形式的JSONObject對象，用來控制列數。

調用方法：（採用aJax）

Ext.Ajax.request({ url : href, success : function(response, options) { var responseText = response.responseText; var jsonObj=eval(‘(‘ + responseText + ‘)’); for(var i=0; ijsonObj.length; i++){ printWord(jsonObj[i],’chuGuoJingZhengMing’); } }, failure : function(response, options) { alert(“fail!”); } });

例子中的word文件：

如果國家為多個時，則會打印出多個文件。

對於代碼的說明：

在後台代碼封裝中，我們將 書籤名 和 值 封裝為一個JSON對象，這樣JS處理中，我們就方便了，不用再逐個寫出每個書籤的`名字，供其查找、然後賦值。

在後台代碼中，我這裡在打印時需要根據國家來確定所要打印的文檔數量，如果為多個國家則要打印出多個文檔，所以在後台封裝，最外層又加了一個JSONArray，JS中也多了一道循環，這個可以根據需要自己調整。

特殊情況下，需要我們單獨處理，如多個表格的情況下，或者表格嵌套表格。

這裡說一下表格嵌套的情況下，如果獲得被嵌套的表格對象。

如：var myTable=word.ActiveDocument.Tables(1).Rows(1).Cells(1).Tables(1);

這裡得到的是文檔中第一個表格的第一行的每一列中的每一個表格對象，其它類似。

range=word.ActiveDocument.Bookmarks(“name”).Range 的意思是 得到文檔中 書籤名為「name」的對象。

range.text=「張三」 為其賦值為 張三。

這裡採用的是dot文件，因為dot文件存在於服務器上，如果使用doc文件作為模板文件的話，在多人訪問時，會出現線程鎖死的情況，故採用dot文件。

附加一段生成好的JSON串：

[ [ {“text”:”year”,”value”:2011}, {“text”:”fileNum”,”value”:5}, {“text”:”leader”,”value”:”彭瓚”}, {“text”:”groupCount”,”value”:5}, {“text”:”country”,”value”:”俄羅斯”}, {“text”:”dispCode”,”value”:”dispCode”}, {“text”:”printYear”,”value”:”2011″}, {“text”:”printMonth”,”value”:”04″}, {“text”:”printDay”,”value”:”07″}, {“text”:”list”,”value”:[[ {“text”:”name1″,”value”:”彭瓚”}, {“text”:”passportNum1″,”value”:””}, {“text”:”name2″,”value”:”郭沁明”}, {“text”:”passportNum2″,”value”:””} ], [ {“text”:”name1″,”value”:”張三五”}, {“text”:”passportNum1″,”value”:””}, {“text”:”name2″,”value”:”彭瓚”}, {“text”:”passportNum2″,”value”:””} ], [ {“text”:”name1″,”value”:”郭沁明”}, {“text”:”passportNum1″,”value”:””}, {“text”:”name2″,”value”:”張三五”}, {“text”:”passportNum2″,”value”:””} ] ] } ], [ {“text”:”year”,”value”:2011}, {“text”:”fileNum”,”value”:7}, {“text”:”leader”,”value”:”彭瓚”}, {“text”:”groupCount”,”value”:5}, {“text”:”country”,”value”:”韓國”}, {“text”:”dispCode”,”value”:”dispCode”}, {“text”:”printYear”,”value”:”2011″}, {“text”:”printMonth”,”value”:”04″}, {“text”:”printDay”,”value”:”07″}, {“text”:”list”,”value”:[ [ {“text”:”name1″,”value”:”彭瓚”}, {“text”:”passportNum1″,”value”:””}, {“text”:”name2″,”value”:”郭沁明”}, {“text”:”passportNum2″,”value”:””} ], [ {“text”:”name1″,”value”:”張三五”}, {“text”:”passportNum1″,”value”:””}, {“text”:”name2″,”value”:”彭瓚”}, {“text”:”passportNum2″,”value”:””} ], [ {“text”:”name1″,”value”:”郭沁明”}, {“text”:”passportNum1″,”value”:””}, {“text”:”name2″,”value”:”張三五”}, {“text”:”passportNum2″,”value”:””} ] ] } ] ]

;

js得到的數據如何打印出來

!doctype html

html

head

meta charset=”utf-8″

title打印測試/title

/head

body

div id=”printDIV”打印內容放在這/div

script type=”text/javascript” language=”javascript”

var str = document.getElementById(“printDIV”).innerHTML;

var printWin=window.open(“打印窗口”, “_blank”);

printWin.document.write(str );

printWin.document.close();

printWin.print();

printWin.close();

/script

/body

/html

使用Javascript怎樣自動打印頁面

1、js實現（可實現局部打印）

[html] view plain copy

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

pXXXXX/p

!–startprint1–要打印的內容!–endprint1–

再加個打印按紐 onclick=preview(1)

2、調用windows底層打印，報安全警告，不建議使用（不支持局部打印）

[html] view plain copy

HTML

HEAD

TITLEjavascript打印-打印頁面設置-打印預覽代碼/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] view plain copy

script type=”text/javascript” src=”jquery-1.4.2.min.js”/script

script type=”text/javascript” src=”jquery.PrintArea.js”/script

script

$(document).ready(function(){

$(“input#biuuu_button”).click(function(){

$(“div#myPrintArea”).printArea();

});

});

/script

input id=”biuuu_button” type=”button” value=”打印”/input

div id=”myPrintArea”…..文本打印部分…../div

點擊打印控件 打印整個頁面 js代碼怎麼實現

把要打印的內容放入一個 span或div，然後通過一個函數打印。

span id=’div1’把要打印的內容放這裡/span

p所有內容/p

div id=”div2″div2的內容/div

a href=”javascrīpt:printme()” target=”_self”打印/a

scrīpt language=”javascrīpt”

function printme()

{

document.body.innerHTML=document.getElementById(‘div1’).innerHTML+’br/’+document.getElementById(‘div2’).innerHTML;

window.print();

}

/scrīpt

js腳本打印的問題 代碼如下 window.onload=function print（）｛ wi

你那個是遞歸調用，而且沒有條件結束遞歸。所以導致「堆棧溢出」。

在JS中，全局的變量與函數實際都window對象的屬性與方式，也就是說你定義function print這個就是window對象的一個方法，就相當於function window.print，所以你的代碼成了：

window.onload=function window.print()｛

window.print();

｝

這就是遞歸調用，會一直調用下去，直到堆棧溢出