页面 打印功能的实现

$(function(){
	init_top_jianju();
	 
});


function print_(){
	//把间距 存在缓存
	var jianju = $("#jianju").val();
	window.localStorage.setItem("print_jzd_top_jianju",jianju);
	$("#top_bar").hide();
	setTimeout(show_bar,500);
	print();
	//启动定时，5秒后显示top_bar
}
function init_jianju(){
	var jianju = $("#jianju").val();
	if(jianju.length<1){
		$("#cc").css("padding-top","0px");
	}else{
		$("#cc").css("padding-top",jianju+"px");	
	}
}
function show_bar(){
	$("#top_bar").show();
}
//设置 间距和整体间距  从网站缓存中拿
function init_top_jianju(){
	var print_jzd_top_jianju = window.localStorage.getItem("print_jzd_top_jianju");
	console.log("print_jzd_top_jianju 缓存的"+print_jzd_top_jianju);
	if(print_jzd_top_jianju){
		$("#cc").css("padding-top",print_jzd_top_jianju+"px");
		var jianju = $("#jianju").val(print_jzd_top_jianju);
	}
}

	<div id="cc" style="width: 800px; float: left; padding-left: 5px;">
		<div id="top_bar" style="overflow: hidden; text-align: center; padding-top: 20px;  ">
			<div style="width: 410px; margin: 0 auto;">
				<div class="layui-form layui-form-pane" action="">
				<div class="layui-form-item">
				    <label class="layui-form-label">上间距</label>
				    <div class="layui-input-inline" style="width: 80px;">
				       <input type="text" id="jianju" onkeyup="init_jianju()" onkeydown="init_jianju()"  autocomplete="off" class="layui-input">
				    </div>
				    <div class="layui-input-inline">
				       <button onclick="print_()" class="layui-btn layui-btn-normal">打印</button>
				   	   <button onclick="window.opener=null;window.open('','_self');window.close();"  class="layui-btn layui-btn-danger">关闭</button>
				    </div>
				  </div>
				  </div>
			  </div>
		</div>
		
		<div style="font-size: 23px; font-weight: bold; padding-bottom: 5px;">河南天康仁医药电商连锁有限公司配送单（出库）复核单</div>
</div>