jquery PrintArea 实现票据的套打功能(代码)

套打就是指不打印表单上的表结构和固定的文言，只把会变化的数据打印出来，下面的例子就是不把name和name2打印出来，只把aaa和bbb打印出来。

1.代码

<html>
<head>
  <script type="text/javascript" src="jquery-1.7.2.min.js"></script>
  <script type="text/javascript" src="jquery.PrintArea.js"></script>
</head>
<body>
  <table>
    <tr>
      <td>
        name:
      </td>
      <td></td>
    </tr>
    <tr>
      <td>
        name2:
      </td>
    </tr>
  </table> 

  <div class="my_show">
    <div style="position: absolute; left: 60px; top: 10px;">
      aaa
    </div>
    <div style="position: absolute; left: 60px; top: 35px;">
      bbb
    </div>
  </div> 

  <a href="javascript:;" rel="external nofollow" id="print" />打印</a> 

  <script type="text/javascript">
  $(document).ready(function() {
    $("#print").click(function() {
        $(".my_show").printArea()
      })
  });
</script>
</body>
</html>

2.画面显示

3.打印结果

以上这篇jquery PrintArea 实现票据的套打功能(代码)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 基于jQuery实现网页打印功能

    基于jQuery实现网页打印功能

    直接上代码 <!DOCTYPE html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>index</title> </head> <body> <div style="text-align:cent

  • jQuery实现区域打印功能代码详解

    使用CSS控制打印样式,需要设置样式media="print",并且将页面中不需要打印的元素的样式display属性设置为none.如DEMO中,我将页头页脚及其他不需要打印的元素的样式设置如下: <style type="text/css" media="print"> #header,.top_title,#jqprint,#footer,#cssprint h3{display:none} </style> 用jQu

  • js或jquery实现页面打印可局部打印

    js或jquery实现页面打印(局部打印) 1.js实现(可实现局部打印) 复制代码 代码如下: <html> <title>js打印</title> <head></head><body> <input id="btnPrint" type="button" value="打印" onclick="javascript:window.print();&quo

  • jquery PrintArea 实现票据的套打功能(代码)

    jquery PrintArea 实现票据的套打功能(代码)

    套打就是指不打印表单上的表结构和固定的文言,只把会变化的数据打印出来,下面的例子就是不把name和name2打印出来,只把aaa和bbb打印出来. 1.代码 <html> <head> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src=&qu

  • 基于jQuery实现仿QQ空间送礼物功能代码

    基于jQuery实现仿QQ空间送礼物功能代码

    我们在QQ空间里面有一个送礼物的功能,显示了最近过生日的人.我们只要把鼠标放到如下图的生日快乐那标签上,就会显示可以给该人送的礼物!! 如下图所示: 单击其中的一个礼物,就会马上送出去.但是我们现在是要说的还有单击更多的时候,会另外弹出一个新的窗口在当前页面最前面!如下图显示: 怎么实现那上面的功能呢? 就是把鼠标放上去,弹出一天tips,单击tips里面的控件,之后弹出另外一个弹出框. 网上就会有很多比较好的插件,就先到网上去找了相对应的jquery插件. jquery中tips的有很多插件,

  • jQuery实现的购物车物品数量加减功能代码

    本文实例讲述了jQuery实现的购物车物品数量加减功能.分享给大家供大家参考,具体如下: 今天网友翠儿在用Jquery实现购物车物品数量的加减特效的时候遇到问题来问我,我后来帮她解决了这个Jquery特效,现在把它整理出来分享给大家用,虽然功能比较简单,但是很实用. 主要包括了以下功能: 1.数量增加操作功能 2.数量减少操作功能 3.总价计算功能 4.自动判断数量到1的时候,减少操作按钮禁止点击,数量增加时自动恢复 5.保留小数点位数toFixed()函数非常实用 功能代码如下: $(func

  • jQuery实现拖拽可编辑模块功能代码

    jQuery实现拖拽可编辑模块功能代码

    在没给大家分享实现代码之前,先给大家展示下效果图: 具体实现代码如下所示: index.html <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>iNettuts - Welcome!</title> <link href=&

  • jQuery实现套选项卡功能

    jQuery实现套选项卡功能

    本文实例为大家分享了jQuery实现套选项卡功能的具体代码,供大家参考,具体内容如下 知识点总结: 1.siblings():兄弟元素,获得匹配集合中每个元素的同胞,通过选择器进行筛选是可选的. 2.removeClass():方法从被选元素移除一个或多个类. 3.addClass():方法向被选元素添加一个或多个类. 4.eq():方法将匹配元素集缩减值指定 index 上的一个. 5.hide()和show():隐藏和显示特效. 6.parent():获得当前匹配元素集合中每个元素的父元素,

  • jQuery实现QQ空间汉字转拼音功能示例

    jQuery实现QQ空间汉字转拼音功能示例

    本文实例讲述了jQuery实现QQ空间汉字转拼音功能.分享给大家供大家参考,具体如下: html: <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>QQ空间的汉字转拼音代码</title> <scrip

  • jQuery实现简单的回到顶部totop功能示例

    本文实例讲述了jQuery实现简单的回到顶部totop功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>回到顶部</title> <style type="text/css"> body{ width: 100%; height: 10000px; } #totop{ wid

  • jQuery结合jQuery.cookie.js插件实现换肤功能示例

    本文实例讲述了jQuery结合jQuery.cookie.js插件实现换肤功能.分享给大家供大家参考,具体如下: 上一次和大家分享了如何实现换肤功能,但是script代码好像有点长,所以这次打算使用cookie.js插件来实现换肤功能,好啦,我们开始吧. jQuery.cookie.js下载:https://github.com/carhartl/jquery-cookie/ 先来了解下cookie.js如何使用. 先导入: <script type="text/javascript&qu

  • 如何利用JQuery实现从底部回到顶部的功能

    今天给大家介绍一下如何利用jQuery实现从任意地方返回顶部的功能,现在大部分网站因为篇幅比较长,所以都会设置这么一个按钮,利用这个按钮可以实现从底部返回顶部的功能.废话不多说,下面就给出这么一个例子介绍一下,它是怎么实现的. 实现方法一: <footer> <p class="ft-copyright">强仔仔 Design by Linzhiqaing 蜀ICP备11002373号-1</p> <div id="tbox"

随机推荐