[英]Print button not working on javascript to print the content of page
I tried the code(it is not running in snippet properly) or you can directly copy paste and run on text editor.If it can be changed with jquery suggest me. 我尝试了代码(它没有在代码段中正确运行),或者您可以直接复制粘贴并在文本编辑器上运行。如果可以用jquery更改,建议我。
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<script language="javascript">
function PrintMe(DivID) {
alert("here");
var disp_setting="toolbar=yes,location=no,";
disp_setting+="directories=yes,menubar=yes,";
disp_setting+="scrollbars=yes,width=650, height=600, left=100, top=25";
var content_vlue = document.getElementById(DivID).innerHTML;
var docprint=window.open("","",disp_setting);
docprint.document.open();
docprint.document.write('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"');
docprint.document.write('"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">');
docprint.document.write('<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">');
docprint.document.write('<head><title>My Title</title>');
docprint.document.write('<style type="text/css">body{ margin:0px;');
docprint.document.write('font-family:verdana,Arial;color:#000;');
docprint.document.write('font-family:Verdana, Geneva, sans-serif; font-size:12px;}');
docprint.document.write('a{color:#000;text-decoration:none;} </style>');
docprint.document.write('</head><body onLoad="self.print()"><center>');
docprint.document.write(content_vlue);
docprint.document.write('</center></body></html>');
docprint.document.close();
docprint.focus();
}
</script>
<style type="text/css">
.hidden {
display: none;
}
</style>
<body>
<script>
var myWindow;
function openWin(DivID) {
var content_print=document.getElementById(DivID).innerHTML;
myWindow = window.open("", "myWindow", "width=1000,height=1000");
myWindow.document.write(content_print);
}
function closeWin() {
myWindow.close();
}
</script>
<div id="divid" class="hidden">
Print the content of this div content in new window.
<button type="button" onclick="PrintMe('divid')">Print</button>
</div>
<button onclick="openWin('divid')">Submit</button>
<button onclick="closeWin()">Close</button>
</body>
</html>
At first my normal page loads: 首先,我的普通页面加载:
When i click submit button then the new window opens with the content of id="divid" .It appears as: 当我单击提交按钮时,新窗口将打开,其中包含id =“ divid”的内容。它显示为:
It is showing me error like: 它向我显示错误,例如:
It happens because pop up window is a new unique document, and it know's nothing about code on your original page. 发生这种情况是因为弹出窗口是一个新的唯一文档,并且它对原始页面上的代码一无所知。 You need to add your function to a your new window. 您需要将功能添加到新窗口中。 if you add script to a div which you use to generate new window you should be fine but it'not a best way to print things consider using function print()
如果将脚本添加到用于生成新窗口的div中,应该没问题,但这不是打印内容的最佳方法,请考虑使用函数print()
<div id="divid" class="hidden">
<script language="javascript">
function PrintMe(DivID) {
alert("here");
var disp_setting="toolbar=yes,location=no,";
disp_setting+="directories=yes,menubar=yes,";
disp_setting+="scrollbars=yes,width=650, height=600, left=100, top=25";
var content_vlue = document.getElementById(DivID).innerHTML;
var docprint=window.open("","",disp_setting);
docprint.document.open();
docprint.document.write('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"');
docprint.document.write('"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">');
docprint.document.write('<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">');
docprint.document.write('<head><title>My Title</title>');
docprint.document.write('<style type="text/css">body{ margin:0px;');
docprint.document.write('font-family:verdana,Arial;color:#000;');
docprint.document.write('font-family:Verdana, Geneva, sans-serif; font-size:12px;}');
docprint.document.write('a{color:#000;text-decoration:none;} </style>');
docprint.document.write('</head><body onLoad="self.print()"><center>');
docprint.document.write(content_vlue);
docprint.document.write('</center></body></html>');
docprint.document.close();
docprint.focus();
}
</script>
Print the content of this div content in new window.
<button type="button" onclick="PrintMe('divid')">Print</button>
</div>
This will probably solve your problem: You can get rid of the printMe() function all together or pass the printMe() function to MyWindow via a function that is written to the MyWindow document. 这可能会解决您的问题:您可以一起摆脱printMe()函数,或者通过写入MyWindow文档的函数将printMe()函数传递给MyWindow。
<script>
var myWindow;
function openWin(DivID) {
var content_print=document.getElementById(DivID).innerHTML;
myWindow = window.open("", "myWindow", "width=1000,height=1000");
myWindow.document.write(content_print);
//print the window
myWindow.print();
}
function closeWin() {
myWindow.close();
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.