用打印DIV方法实现简易网页打单

前段时间搞了个网页打单,方法:在DIV中生成想要的东西并打印出来,现贴出来供参考(剃除了数据生成加载、条码、转换等功能),代码有缺陷,需要用到的朋友请自行完善,不能用概不负责!

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>XX单据打印</title>
<link href="style/style.css" type="text/css" rel="stylesheet" />
<style type="text/css">
@media print{
  .noprint{
     display:none
  }
}
body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    -moz-user-select:none;
    -webkit-user-select:none;
    user-select:none;  
}
</style>
<script language="javascript">
if(document.all){
    document.onselectstart= function(){return false;}; //for ie
}else{
    document.onmousedown= function(){return false;};
    document.onmouseup= function(){return true;};
}
document.onselectstart = new Function('event.returnValue=false;');

//劫持开始选择事件和(或)鼠标按下、抬起事件。
</script>
</head>

<body>
<div style="width:800px; margin-left:auto; margin-right:auto;text-align:center;">

  <table width="800" border="0" align="center" cellpadding="0" cellspacing="0" class="PrintTable">
      <tr>
        <td colspan="3" style="line-height:29px;">&nbsp;</td>
      </tr>
  </table>
<div id="div_print" class="div_print">
    <table width="800" border="0" align="center" cellpadding="0" cellspacing="0" class="PrintTable">
      <tr>
        <td>&nbsp;</td>
        <td>
        <table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td colspan="2" align="center" style="font-size:24px;font-family:'微软雅黑',Tahoma;font-weight:bold;word-spacing:19px;letter-spacing:2px;text-decoration:underline;"><div style="padding-left:150px">这里是TITLE</div></td>
            <td rowspan="2" align="center" valign="top" style="font-size:24px;font-family:'微软雅黑',Tahoma;font-weight:bold;word-spacing:19px;letter-spacing:2px;text-decoration:underline;"><img src="../barcode/test.php?codebar=BCGcode128&text=8216121211014" height="58" width="150"></td>
          </tr>
          <tr>
            <td colspan="2" align="left" style="font-size:12px;font-family:'微软雅黑', Tahoma; font-weight:normal;word-spacing:5px;letter-spacing:0px;line-height:28px;">公司地址:公司地址公司地址公司地址公司地址公司地址公司地址公司地址公司地址公司地址公司地址;电话号码:020-xxxxxxxx</td>
            </tr>
          <tr style="font-size:12px;line-height:18px;">
            <td colspan="2" align="left">客户名称:这里是客户名称</td>
            <td align="right" style="text-align:right;">送货日期:2016-12-01</td>
          </tr>
          <tr style="font-size:12px;line-height:18px;">
            <td align="left">收货地址:广东省广州市番禺区大石街道沙溪村新沙路888号</td>
            <td align="center">联系人:某小姐</td>
            <td align="right">联系电话:18818881888</td>
            </tr>
        </table>
        </td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>
        <table width="100%" border="1" cellspacing="0" cellpadding="0" class="PrintTableList" id="PrintTableList">
          <tr>
            <td width="30" align="center"><strong>行号</strong></td>
            <td width="100" align="center"><strong>商品条码</strong></td>
            <td align="center"><strong>商品名称</strong></td>
            <td align="center"><strong>箱装规格</strong></td>
            <td width="40" align="center"><strong>数量</strong></td>
            <td width="40" align="center"><strong>单位</strong></td>
            <td align="center"><strong>单价</strong></td>
            <td align="center"><strong>金额</strong></td>
            <td width="50" align="center"><strong>参考件数</strong></td>
            <td align="center"><strong>备注</strong></td>
          </tr>
          <tr>
            <td align="center">1</td>
            <td align="center">4710098164268</td>
            <td align="left" style="padding-left:4px;">77蜜蘭諾 192G松塔[12粒]</td>
            <td align="center">1*15</td>
            <td align="center">1</td>
            <td align="center"></td>
            <td align="center">232.00</td>
            <td width="60" align="center">232.00</td>
            <td align="center">1</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">2</td>
            <td align="center">4713507006067</td>
            <td align="left" style="padding-left:4px;">Aji 200g起士惊奇饼[袋装]</td>
            <td align="center">1*12</td>
            <td align="center">1</td>
            <td align="center"></td>
            <td align="center">70.00</td>
            <td align="center">70.00</td>
            <td align="center">1</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">3</td>
            <td align="center">6906959863250</td>
            <td align="left" style="padding-left:4px;">东阿桃花姬阿胶糕300克</td>
            <td align="center">1*8</td>
            <td align="center">10</td>
            <td align="center"></td>
            <td align="center">534.00</td>
            <td align="center">2320.00</td>
            <td align="center">10</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">4</td>
            <td align="center">6906959863649</td>
            <td align="left" style="padding-left:4px;">东阿桃花姬阿胶糕30克</td>
            <td align="center">1*60</td>
            <td align="center">10</td>
            <td align="center"></td>
            <td align="center">24.50</td>
            <td align="center">245.00</td>
            <td align="center">0.17</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">5</td>
            <td align="center">8858761400254</td>
            <td align="left" style="padding-left:4px;">榴的华金枕头榴莲干30g</td>
            <td align="center">1*50</td>
            <td align="center">2</td>
            <td align="center"></td>
            <td align="center">810.00</td>
            <td align="center">1620.00</td>
            <td align="center">2</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">6</td>
            <td align="center">8936050230178</td>
            <td align="left" style="padding-left:4px;">沙巴哇综合蔬果干100g*40袋/箱</td>
            <td align="center">1*40</td>
            <td align="center">1</td>
            <td align="center"></td>
            <td align="center">292.00</td>
            <td align="center">292.00</td>
            <td align="center">1</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">7</td>
            <td align="center">6940996701045</td>
            <td align="left" style="padding-left:4px;">明治雪吻巧克力62g</td>
            <td align="center">1*60</td>
            <td align="center">5</td>
            <td align="center"></td>
            <td align="center">840.00</td>
            <td align="center">4200.00</td>
            <td align="center">5</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">8</td>
            <td align="center">8000380005949</td>
            <td align="left" style="padding-left:4px;">莱家黑加仑子味粒粒装威化饼125g</td>
            <td align="center">1*12</td>
            <td align="center">1</td>
            <td align="center"></td>
            <td align="center">162.00</td>
            <td align="center">162.00</td>
            <td align="center">1</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">9</td>
            <td align="center">6923299611846</td>
            <td align="left" style="padding-left:4px;">香海鱼豆腐辣孜然味100g</td>
            <td align="center">1*40</td>
            <td align="center">1</td>
            <td align="center"></td>
            <td align="center">204.00</td>
            <td align="center">204.00</td>
            <td align="center">1</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td align="center">10</td>
            <td align="center">4895058313099</td>
            <td align="left" style="padding-left:4px;">EDO芒果酥154g 蓝莓酥</td>
            <td align="center">1*18</td>
            <td align="center">2</td>
            <td align="center"></td>
            <td align="center">180.00</td>
            <td align="center">180.00</td>
            <td align="center">2</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td colspan="2" align="center">小计:</td>
            <td colspan="2" align="left">&nbsp;</td>
            <td align="center">34</td>
            <td colspan="2" align="center">&nbsp;</td>
            <td align="center">9525.00</td>
            <td align="center">24.17</td>
            <td align="center">&nbsp;</td>
          </tr>
          <tr>
            <td colspan="2" align="center"><strong>合计:</strong></td>
            <td colspan="2" align="left">&nbsp;</td>
            <td align="center"><strong>34</strong></td>
            <td colspan="2" align="center">&nbsp;</td>
            <td align="center"><strong>9525.00</strong></td>
            <td align="center"><strong>24.17</strong></td>
            <td align="center">&nbsp;</td>
          </tr>
        </table></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>
        <table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr style="line-height:26px;">
            <td align="left"><strong>备注:</strong>收货人没付款请签名,收货时间上午9:00-12:00。</td>
            <td align="right"><span style=" font-size:16px;"><strong>金额大写:</strong>玖仟伍佰贰拾伍元整</span></td>
            </tr>
        </table>
        <table width="100%" border="0" cellspacing="0" cellpadding="0" style="line-height:20px;">
          <tr>
            <td align="left">制单人:xxxxxx</td>
            <td align="left">业务员:xxxxxx</td>
            <td width="25%" align="center">出库人:<span style="text-decoration:underline;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></td>
            <td width="25%" align="center">送货人:<span style="text-decoration:underline;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></td>
            <td width="20%" align="right">&nbsp;</td>
          </tr>
        </table>
        <table width="100%" border="0" cellspacing="0" cellpadding="0" style="line-height:20px;">
          <tr>
            <td align="left">本单共四联&nbsp;&nbsp;白联:留底&nbsp;&nbsp;&nbsp;&nbsp;粉联:客户联&nbsp;&nbsp;&nbsp;&nbsp;蓝联:对帐联&nbsp;&nbsp;&nbsp;&nbsp;黄联:仓库联</td>
            <td align="right">第1页,共1页</td>
            <td width="32%" align="right">收货人签名:<span style="text-decoration:underline;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></td>
            </tr>
        </table>
        </td>
        <td>&nbsp;</td>
      </tr>
    </table>
    <h1 style="Color:Red"></h1>
</div>
<object classid= "CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 " height=0 id=WB name=wb width=0 VIEWASTEXT> </object>
<script language="javascript">
var hkey_root,hkey_path,hkey_key
hkey_root= "HKEY_CURRENT_USER "
hkey_path= "\\\\Software\\\\Microsoft\\\\Internet Explorer\\\\PageSetup\\\\ "

// 设置页眉页脚为空
function PageSetup_Null()
{
try{
var RegWsh = new ActiveXObject( "WScript.Shell ") ;
hkey_key= "header " ;
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key, " ") ;
hkey_key= "footer " ;
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key, " ") ;
}
catch(e){}
}

// 设置页眉页脚为默认值
function PageSetup_Default()
{
try{
var RegWsh = new ActiveXObject( "WScript.Shell ") ;
hkey_key= "header " ;
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key, "&w&b页码,&p/&P ") ;
hkey_key= "footer " ;
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key, "&u&b&d ") ;
}
catch(e){}
}

function printdiv(div_print) {//打印div
    var headstr = "<html><head><title></title></head><body>";
    var footstr = "</body></html>";
    var newstr = document.all.item(div_print).innerHTML; 
    var oldstr = document.body.innerHTML;
    document.body.innerHTML = headstr + newstr + footstr;

    PageSetup_Null();
    window.print();
    document.body.innerHTML = oldstr;
    window.location.reload(); //
    return false;
}
</script>
<div style="width:100%; text-align:right; line-height:30px;"><span style="margin-right:5px;">此为分页</span></div>
<div style="width:100%; text-align:right;"><input name="b_print" type="button" class="button" onClick="printdiv('div_print');" value="打印单据">&nbsp;&nbsp;<input name="b_close" type="button" class="button" onClick="javascript:window.close()" value="关闭页面" style="margin-right:5px;"></div>
</div>
</body>
</html>

效果图:
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值