Lodop模版有兩種方法,一種是傳統的JS語句,可以用JS方法里的eval來執行,一種是文檔式模版,是特殊格式的base64碼,此篇博文介紹JS模版的加載和賦值。
兩種模版都可以存入一下地方進行調用,比如數據庫等。
JS模版的生成,可查看本博客的相關博文:Lodop的JS模版代碼、文檔式模版 生成加載賦值博文索引
關於該JS模版的加載,需要使用JS里的一個方法,eval()方法,該方法屬於JS的范疇,並非lodop語句,有另一篇博文介紹這個JS方法:
前面那個Lodop的JS模版的生成,有幾種方法,例如獲取打印設計的返回值,返回的是帶INIT初始化語句和打印項以及樣式語句的代碼。
該模版可當做字符串存入需要的地方,調用的時候,直接用eval()方法加載這個字符串。
JS模版賦值有兩種
1.存的模版里,值本來就是變量,並非字符串,這種可以在加載模版前給變量賦一下值,例如:
LODOP.ADD_PRINT_TEXT(131,175,254,168,NR);//這是模版中該打印項的語句
加載模版前,給打印項賦值一下,例如:
var NR=新的值;
eval(整個模版的字符串);
這樣里面的NR就是新的了。
2.存的模版里,值是字符串,原始字符串,並非變量,這種可以在加載模版后進行賦值修改值,例如:
LODOP.ADD_PRINT_TEXTA("neirong",131,175,254,168,"內容");//這是模版中該打印項的語句
加載模版后,給打印項賦值一下,例如:
eval(整個模版的字符串);
LODOP.SET_PRINT_STYLEA("neirong","CONTENT", 新的值);
注意:也可以根據序號等賦值,這里是根據打印項類名賦值,注意如果有同類名,會都被替換成新的值。
存是普通原始值,用content賦新值,測試代碼:
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>WEB打印控件LODOP</title> <script language="javascript" src="LodopFuncs.js"></script> </head> <body> <textarea rows="10" id="S1" cols="98" >LODOP.PRINT_INIT(""); LODOP.ADD_PRINT_TEXT(50,252,101,41,"標題"); LODOP.SET_PRINT_STYLEA(0,"FontName","楷體"); LODOP.SET_PRINT_STYLEA(0,"FontSize",17); LODOP.ADD_PRINT_TEXTA("zhuti",74,401,100,20,"主題"); LODOP.SET_PRINT_STYLEA(0,"FontName","楷體"); LODOP.ADD_PRINT_LINE(107,112,102,493,0,5); LODOP.ADD_PRINT_TEXTA("neirong",131,175,254,168,"內容"); LODOP.SET_PRINT_STYLEA(0,"FontSize",12); </textarea><br> <a href="javascript:prn1_preview()">加載原始JS模版</a><br> 請輸入標題: <input type="text" id="B1" size="5"> <br> 請輸入主題: <input type="text" id="Z1" size="5"><br> 請輸入內容: <input type="text" id="N1" size="50"><br> <a href="javascript:prn2_preview()">加載頁面輸入的新內容的該JS模版</a> <script language="javascript" type="text/javascript"> var LODOP; //聲明為全局變量 function prn1_preview(){ LODOP=getLodop(); eval(document.getElementById('S1').value); //LODOP.PRINT_DESIGN(); LODOP.PREVIEW(); }; function prn2_preview(){ LODOP=getLodop(); eval(document.getElementById('S1').value); LODOP.SET_PRINT_STYLEA(1,"CONTENT", document.getElementById('B1').value); //根據序號賦值 LODOP.SET_PRINT_STYLEA("zhuti","CONTENT", document.getElementById('Z1').value); //根據打印項類名賦值 LODOP.SET_PRINT_STYLEA("neirong","CONTENT", document.getElementById('N1').value); //根據打印項類名賦值 LODOP.PREVIEW(); //注意,如果類名有重復的,賦值時所有相同類名的打印項的值都會被替換 }; </script> </body>
圖示:
存的是變量的模版,測試代碼:
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>WEB打印控件LODOP</title> <script language="javascript" src="LodopFuncs.js"></script> </head> <body> <textarea rows="10" id="S1" cols="98" > LODOP.PRINT_INIT(""); LODOP.ADD_PRINT_TEXT(50,252,101,41,BT); LODOP.SET_PRINT_STYLEA(0,"FontName","楷體"); LODOP.SET_PRINT_STYLEA(0,"FontSize",17); LODOP.ADD_PRINT_TEXTA("zhuti",74,401,100,20,ZT); LODOP.SET_PRINT_STYLEA(0,"FontName","楷體"); LODOP.ADD_PRINT_LINE(107,112,102,493,0,5); LODOP.ADD_PRINT_TEXTA("neirong",131,175,254,168,NR); LODOP.SET_PRINT_STYLEA(0,"FontSize",12); </textarea><br> 請輸入標題: <input type="text" id="B1" size="5"> <br> 請輸入主題: <input type="text" id="Z1" size="5"><br> 請輸入內容: <input type="text" id="N1" size="50"><br> <a href="javascript:prn1_preview()">加載直接變量賦值后內容</a> <script language="javascript" type="text/javascript"> var LODOP; //聲明為全局變量 function prn1_preview(){ LODOP=getLodop(); var BT=document.getElementById('B1').value; var ZT=document.getElementById('Z1').value; var NR=document.getElementById('N1').value; eval(document.getElementById('S1').value); LODOP.PREVIEW(); }; </script> </body>
圖示:
兩者對比圖:
注意,一個是在加打印項前賦值,一個是在加打印項后賦值。