在文本区域中的文本后添加白色分隔线
Add white breaking line after text in textarea
我想在文本区域中的文本之后有一个断行或两个断行,而不需要用户点击 "Enter" 换行,这样空行将显示在打印页面中
<html >
<head>
<!-- script print button -->
<script type="text/javascript">
function printTextArea() {
childWindow = window.open('','childWindow','location=yes, menubar=yes, toolbar=yes');
childWindow.document.open();
childWindow.document.write('<html><head></head><body dir="rtl">');
childWindow.document.write(document.getElementById('targetTextArea').value.replace(/\n/gi,'<br/>'));
childWindow.document.write('</body></html>');
childWindow.print();
childWindow.document.close();
childWindow.close();
}
</script>
<style type="text/css">
textarea {
direction: rtl;
background-color: white;
font-size: 1em;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
border: 1px solid #00acee;
resize: none;
}
</style>
</head>
<body>
<p>
<TEXTAREA name="thetext" rows="20" cols="80"id="targetTextArea" placeholder="قم بنسخ و لصق الطلب لملأه و التعديل عليه و طباعته بالزر أسفله ......">
</TEXTAREA>
</p>
<!-- print button -->
<center> <input type="button" onclick="printTextArea()" value="طباعة"/></center>
</body>
</html>
这应该可以解决问题。如果填充看起来不太好,请尝试添加边距。
@media print {
textarea {padding-bottom:2cm;}
}
我想在文本区域中的文本之后有一个断行或两个断行,而不需要用户点击 "Enter" 换行,这样空行将显示在打印页面中
<html >
<head>
<!-- script print button -->
<script type="text/javascript">
function printTextArea() {
childWindow = window.open('','childWindow','location=yes, menubar=yes, toolbar=yes');
childWindow.document.open();
childWindow.document.write('<html><head></head><body dir="rtl">');
childWindow.document.write(document.getElementById('targetTextArea').value.replace(/\n/gi,'<br/>'));
childWindow.document.write('</body></html>');
childWindow.print();
childWindow.document.close();
childWindow.close();
}
</script>
<style type="text/css">
textarea {
direction: rtl;
background-color: white;
font-size: 1em;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
border: 1px solid #00acee;
resize: none;
}
</style>
</head>
<body>
<p>
<TEXTAREA name="thetext" rows="20" cols="80"id="targetTextArea" placeholder="قم بنسخ و لصق الطلب لملأه و التعديل عليه و طباعته بالزر أسفله ......">
</TEXTAREA>
</p>
<!-- print button -->
<center> <input type="button" onclick="printTextArea()" value="طباعة"/></center>
</body>
</html>
这应该可以解决问题。如果填充看起来不太好,请尝试添加边距。
@media print {
textarea {padding-bottom:2cm;}
}