【发布时间】:2015-09-09 04:48:38
【问题描述】:
我正在尝试打印具有一些复选框的特定 div。我正在使用从 db 接收的数据通过 jQuery 在页面加载时检查这些复选框。
问题是当我尝试打印 div 时,复选框仍未选中。 IE。 jQuery 检查不会影响打印视图。
下面是我打印 div 的代码
$(function () {
$("#btnPrint").click(function () {
var contents = $("#printDiv").html();
var frame1 = $('<iframe />');
frame1[0].name = "frame1";
$("body").append(frame1);
var frameDoc = frame1[0].contentWindow ? frame1[0].contentWindow : frame1[0].contentDocument.document ? frame1[0].contentDocument.document : frame1[0].contentDocument;
frameDoc.document.open();
//Create a new HTML document.
frameDoc.document.write('<html><head><title>DIV Contents</title>');
frameDoc.document.write('</head><body>');
//Append the external CSS file.
frameDoc.document.write('<link href="css/carousel.css" rel="stylesheet" type="text/css">');
frameDoc.document.write('<link href="css/activities_folder.css" rel="stylesheet" type="text/css">');
//Append the DIV contents.
frameDoc.document.write(contents);
frameDoc.document.write('</body></html>');
frameDoc.document.close();
setTimeout(function () {
window.frames["frame1"].focus();
window.frames["frame1"].print();
frame1.remove();
}, 500);
});
});
要打印的div如下
<div id="printDiv" >
<p class="ques"><strong>1. Parental conflict affects children in different ways. Have you observed any of these signs in your child recently? </strong></p>
<ul class="filters">
<li class="col-xs-12">
<label>
<input type="checkbox" name="q1" value="Increased anger issues" disabled>
<span class="icon"><i class="fa fa-check"></i></span>
<span>Increased anger issues</span>
</label>
</li>
<li class="col-xs-12">
<label>
<input type="checkbox" name="q1" value="Violent or criminal behavior" disabled>
<span class="icon"><i class="fa fa-check"></i></span>
<span>Violent or criminal behavior</span>
</label>
</li>
<li class="col-xs-12">
<label>
<input type="checkbox" name="q1" value="Depression & loneliness" disabled>
<span class="icon"><i class="fa fa-check"></i></span>
<span>Depression & loneliness</span>
</label>
</li>
<li class="col-xs-12">
<label>
<input type="checkbox" name="q1" value="Withdrawal from friends & family" disabled>
<span class="icon"><i class="fa fa-check"></i></span>
<span>Withdrawal from friends & family</span>
</label>
</li>
<li class="col-xs-12">
<label>
<input type="checkbox" name="q1" value="Poor academic performance" disabled>
<span class="icon"><i class="fa fa-check"></i></span>
<span>Poor academic performance</span>
</label>
</li>
<li class="col-xs-12">
<label>
<input type="checkbox" name="q1" value="Health problems & medical conditions" disabled>
<span class="icon"><i class="fa fa-check"></i></span>
<span>Health problems & medical conditions</span>
</label>
</li>
<li class="col-xs-12">
<label>
<input type="checkbox" name="q1" value="Low self-esteem, self-worth" disabled>
<span class="icon"><i class="fa fa-check"></i></span>
<span>Low self-esteem, self-worth</span>
</label>
</li>
</ul>
</div>
<button id="btnPrint" value="Print" class="myPrintBtn">Print</button>
检查复选框的jquery代码是,
$(document).ready(function() {
var currentAnsArray = ["Increased anger issues","Health problems & medical conditions"];
$("input:checkbox[name=q1]").each(function(){
for(var n=0; n < currentAnsArray.length; n++)
{
if($(this).val() == currentAnsArray[n])
{
$(this).prop('checked', true);
break;
}
}
});
});
编辑:编辑@Ovchynnykov 所说的currentAnsArray,以便更清楚地说明问题
请帮助..任何人???
【问题讨论】:
标签: javascript html css checkbox printing