1.指定打印区域
<div id
="div1">div中的要打印的所有内容
</div
>
<a href
="javascrīpt:printme()" target
="_self">打印
</a
>
<scrīpt language
="javascrīpt">
function printme()
{
document
.body
.innerHTML
=document
.getElementById('div1').innerHTML
;
window
.print();
}
</scrīpt
>
2.指定不打印的区域
<style media
=print type
="text/css">
.noprint
{
visibility
:hidden
}
</style
>
<div id
="div1">div中的要打印的所有内容
<p
class="noprint">将不打印的代码放在这里。
</p
>
</div
>
<p
class="noprint">将不打印的代码放在这里。
</p
>
<a href
="javascrīpt:printme()" target
="_self">打印
</a
>
<scrīpt language
="javascrīpt">
function printme()
{
document
.body
.innerHTML
=document
.getElementById('div1').innerHTML
;
window
.print();
}
</scrīpt
>
3.案例demo
<form class="form-horizontal">
<div id="printingDiv">
<div class="form-group">
<div class="col-sm-2 control-label">备案单位:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyRecord">{{registrationForm.lcRegistrationVo.record}}
</span>
<span class="spanCopy" @click="copyValue('copyRecord')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">备案人:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyRecordPerson">{{registrationForm.lcRegistrationVo.recordPerson}}
</span>
<span class="spanCopy" @click="copyValue('copyRecordPerson')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">身份证号:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyIdCard">{{registrationForm.lcRegistrationVo.idCard}}
</span>
<span class="spanCopy" @click="copyValue('copyIdCard')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">统一社会信用代码:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copySocialCode">{{registrationForm.lcRegistrationVo.socialCode}}
</span>
<span class="spanCopy" @click="copyValue('copySocialCode')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">联系电话:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyPhone">{{registrationForm.lcRegistrationVo.phone}}
</span>
<span class="spanCopy" @click="copyValue('copyPhone')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">备案名称:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyRecordName">{{registrationForm.lcRegistrationVo.recordName}}
</span>
<span class="spanCopy" @click="copyValue('copyRecordName')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">地址:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyAddress">{{registrationForm.lcRegistrationVo.address}}
</span>
<span class="spanCopy" @click="copyValue('copyAddress')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">规格:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copySpecs">{{registrationForm.lcRegistrationVo.specs}}
</span>
<span class="spanCopy" @click="copyValue('copySpecs')">复制
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">使用材质:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyMaterial">{{registrationForm.lcRegistrationVo.material}}
</span>
<span class="spanCopy" @click="copyValue('copyMaterial')">复制
</span>
</div>
</div>
</div>
<div v-show="showMoney" class="form-group">
<div class="col-sm-2 control-label">代缴费用:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>
<span id="copyMoney">{{registrationForm.money}}元
</span>
<span class="spanCopy" @click="copyValue('copyMoney')">复制
</span>
</div>
</div>
</div>
<div v-show="showEason">
<div class="form-group">
<div class="col-sm-2 control-label">{{registrationForm.easonStatus}}:
</div>
<div class="col-sm-10" style="margin-top: 7px">
<div>{{registrationForm.eason}}
<span id="copyEason">{{registrationForm.eason}}
</span>
<span class="spanCopy" @click="copyValue('copyEason')">复制
</span>
</div>
</div>
</div>
</div>
</div>
<div class="form-group" style="margin-top: 7px">
<div class="col-sm-2 control-label">资料下载:
</div>
<input type="button" class="btn btn-primary" @click="downloadDetails" value="审核资料下载"/>
</div>
<div class="form-group" style="margin-top: 7px">
<div class="col-sm-2 control-label">打印:
</div>
<input type="button" class="btn btn-primary" @click="printingDetails" value="打印"/>
</div>
</form>
printingDetails
: function () {
document
.body
.innerHTML
= document
.getElementById('printingDiv').innerHTML
;
window
.print();
},
