ravand
سه شنبه 20 مرداد 1394, 10:39 صبح
سلام
من یه برنامه ی ساده با بوت استرپ نوشتم که با پرینت کردن مشکل داره.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$(".btnPrint").click(function () {
var contents = $(".dvContents").html();
var frame1 = $('<iframe />');
frame1[0].name = "frame1";
frame1.css({ "position": "absolute", "top": "-1000000px" });
$("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="style.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);
});
});
</script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="mydiv container-fluid">
<div class="row">
<div class="dvContents col-xs-12 col-sm-6 col-md-5 col-lg-4">
<div class="contents">
<span class="label">Hello,
<br />
This is <span class="name">Mudassar Khan</span>.<br />
Hoping that you are enjoying my articles!
</span>
</div>
</div>
<br />
<input type="button" class="btnPrint" value="Print" />
</div>
</div>
</body>
</html>
دستورات css:
@import "css/bootstrap.rtl.css";
.label
{
font-size: 10pt;
font-weight: bold;
font-family: Arial;
}
.contents
{
border: 1px dotted black;
padding: 5px;
}
.name
{
color: #18B5F0;
}
.clear
{
clear: both;
}
وقتی دکمه print را میزنم رنگ متن نمایش داده نمیشه و همه اش سیاه میشه.
بدون فایل بوت استرپ مشکلی نداره ولی وقتی بوت استرپ را اضافه میکنم این مشکل رو داره.
متشکرم.
من یه برنامه ی ساده با بوت استرپ نوشتم که با پرینت کردن مشکل داره.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$(".btnPrint").click(function () {
var contents = $(".dvContents").html();
var frame1 = $('<iframe />');
frame1[0].name = "frame1";
frame1.css({ "position": "absolute", "top": "-1000000px" });
$("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="style.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);
});
});
</script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="mydiv container-fluid">
<div class="row">
<div class="dvContents col-xs-12 col-sm-6 col-md-5 col-lg-4">
<div class="contents">
<span class="label">Hello,
<br />
This is <span class="name">Mudassar Khan</span>.<br />
Hoping that you are enjoying my articles!
</span>
</div>
</div>
<br />
<input type="button" class="btnPrint" value="Print" />
</div>
</div>
</body>
</html>
دستورات css:
@import "css/bootstrap.rtl.css";
.label
{
font-size: 10pt;
font-weight: bold;
font-family: Arial;
}
.contents
{
border: 1px dotted black;
padding: 5px;
}
.name
{
color: #18B5F0;
}
.clear
{
clear: both;
}
وقتی دکمه print را میزنم رنگ متن نمایش داده نمیشه و همه اش سیاه میشه.
بدون فایل بوت استرپ مشکلی نداره ولی وقتی بوت استرپ را اضافه میکنم این مشکل رو داره.
متشکرم.