使用jquery自动打印

2023-11-21

我有以下格式的数据:

(虚拟条目)(id=posGridView)

enter image description here

当我处理销售时,会自动打印一张小收据,其中包含选定的列,而不是所有列。

因为所有数据都在此网格视图中可用,所以如何使用 jquery 以任何格式动态打印它?

Edited

实际上我想从上面的网格视图以这种格式动态打印

enter image description here


Printing

打印页面不需要 jQuery,只需要 JavaScript 函数:window.print();.

如果需要打印特定内容,可以通过CSS隐藏其余内容(并格式化打印区域):

<style media="screen">
  .noPrint{ display: block; }
  .yesPrint{ display: block !important; }
</style> 
<style media="print">
  .noPrint{ display: none; }
  .yesPrint{ display: block !important; }
</style>

如您所见,通过设置media样式标签的属性中,您可以为普通视图(屏幕)和打印视图(打印)设置样式。完整文章是here.

Dynamism

您可以为该过程添加一定的活力,但请记住,它可以动态地对于用户,但在您的代码中你必须找到并且event附上印刷品。该事件可能是锚点中的点击:

<a href='javascript:window.print();'>Print</a>

它可能是onload您页面的事件:

window.onload = function () {
    window.print();
}

或者您可能需要注意的任何其他事件(请注意,现在我正在使用 jQuery):

var doPrintPage;

function printPage(){
    window.print();
}

$(document).ready(function(){
    $('input').blur(function(){
        //3sec after the user leaves the input, printPage will fire
        doPrintPage = setTimeout('printPage();', 3000);
    });
    $('input').focus(function(){
        //But if another input gains focus printPage won't fire
        clearTimeout(doPrintPage);
    });
});

上面的代码非常简单:用户留下输入三秒后,打印页面会火。如果一个输入在这三秒内获得焦点,打印页面不会被调用。我真的不认为这个精确的代码是您所需要的,但我会指出如何模拟dynamism。这里可以看到设置超时时间 and 清除超时定义。

编辑:我几乎不建议你通过 CSS 隐藏不需要打印的 html,如上所述并调用窗口打印。不管怎样,我在这里添加了一些代码来通过新页面执行此操作。

从全新页面打印

如果您想打印from一个与您所显示的页面完全不同的页面,您可以请求该页面,在服务器端管理 html,然后告诉该页面在加载后立即打印。至少有两种方法可以做到这一点。让我们一步步看看它们:

A) 第一个选择是将 GridView 发送到新页面并从那里打印。问题是您无法轻松打开新页面来执行此操作,因此您必须从页面浏览到显示要打印的 html 的新页面。

A1) 为此,您需要用表单包围 GridView:

<form runat="server">
<asp:GridView id="gridView" />
<asp:Button id="btnPrint" Text="Print" runat="server" OnClick="btnPrint_Click" />
</form>

A2) 然后从 *btnPrint_Click* 您将调用您的“printPage.aspx”。请记住,如果您使用 JS/jQuery 更改了 GridView,这些更改可能不可用(因为 .NET 很可能读取隐藏状态变量而不是您的 GridView)。

B) 第二种方法是通过 JavaScript。但请记住,通过此选择,如果您想在新页面中编辑表格,您将遇到困难(因为您不会收到 GridView,而是收到 html)。好处是您可以轻松打开新页面:

B1)当然,您需要一个表单(注意它的目标和操作),例如:

<form id="myPageForm" name="myPageForm" target="_blank" action="printPage.aspx">
    <input type="hidden" name="htmlToPrint" id="htmlToPrint" />
    <input type="button" value="submit">Print</button>
</form>

B2) 然后你必须将数据传递到该锚点。在提交表单之前,请使用表数据设置输入:

$(document).ready(function(){
    $('#myPageForm').submit(function(){
        //Filling the hidden input
        var htmlToPrint = $(".posGridView").html(); //I'm using a class and not an ID 'cause .NET will change your GridView's ID when rendering you page
        $("#htmlToPrint").value(htmlToPrint);
        return true;
    });
});

一旦您的服务器端 (printPage.asx) 有了数据,您就可以轻松创建要打印的 HTML 并在该页面上调用 window.print()onload, 如上所述。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用jquery自动打印 的相关文章

  • jQuery Calendar:如何在特定日期添加可点击事件?

    我正在使用 jquery 完整日历http arshaw com fullcalendar http arshaw com fullcalendar显示会议 我只是想确认是否可以添加活动 让我们创建一个新会议 使用 php ajax 在特定
  • 如何在 js.erb 中使用 Ruby 代码?

    我可以使用以下方式在模态中渲染部分内容escape javascript在js erb文件代码中 body append my modal modal show 但是 我似乎无法获得以下结果 console log ERB 将输出一个纯字符
  • 如何捕获jquery中的任何点击事件[重复]

    这个问题在这里已经有答案了 我有一个按钮 当单击它时 会显示一个带有图像的 div 例如聊天的表情符号面板 如果我再次单击它 div 会隐藏 但我想要做的是 如果 div 已经显示 然后我单击页面的任何其他内容 我想隐藏它 我试过这个 my
  • 设置三个输入数字的最大值

    我有三个输入数字
  • 将jQueryUI datepicker附加到div(显示位置错误)

    我在输入上使用 jQueryUI datepicker 默认情况下 jQueryUI 会附加 ui datepicker div to the body该文件的 有问题的输入位于屏幕上的 弹出 div 中 这意味着该 div 之外的任何点击
  • a:not(a:not([href])) 选择器

    我希望无论何时 某个操作都与锚标记的点击事件相关联href属性 不开始于mailto and 不以 and 存在任何值 包括空 所以我正在尝试这段代码 a href example com example com a a href Some
  • 通过 jQuery ajax 将 JSON 对象数组发送到 MVC3 操作方法

    模型绑定器不支持 JSON 对象数组吗 下面的代码在发送单个 JSON 域对象作为 ajax post 的一部分时起作用 但是 当发送 JSON 域对象数组时 action 参数为 null var domains DomainName t
  • 如何使用 jQuery 解析 JavaScript 对象

    jQuery JavaScript 中用于解析 JSON 对象并返回键 值对的 foreach 等效项是什么 JSON 对象 是什么意思 JSON 是一种用于序列化对象的文本格式 如果要循环访问通过反序列化 JSON 字符串获得的对象中的属
  • 如何在网页上显示进度条直到网页完全加载?

    我想在网页中显示进度条 加载弹出窗口 直到页面完全加载 我的网页很重 因为它包含一个 HTML 编辑器 这是一个基于 jQuery 的 HTML 编辑器 需要很多时间才能完全加载 在加载时 我希望在页面上显示一个进度条 该进度条将在整个页面
  • Reload $(document).ready(function() ajax页面重新加载后

    我有一个通用的js文件 在ajax请求中重新加载html页面后 我无法访问该文件中的函数 即之间的常见JS函数 文档 ready 函数 如何访问它们并触发公共文件中的函数Example 常见的JS document ready functi
  • 根据类名查找 div id

    我必须根据它的类找到div id 如果div有名为searchItemSelected的类 那么如何获取它的div id div class CheckinWithUserRow1 searchItemSelected style heig
  • jquery-ui-选项卡。传递查询字符串

    如何通过与以下选项卡关联的以下每个链接传递查询字符串 id avalue 我试图在选项卡中打开外部内容 它工作正常 但我未能通过网址传递参数 每个链接的参数值都相同 我的功能代码 div ul li a href table aspx sp
  • 如何使用本地存储进行活动类?

    如何使用本地存储保存所选菜单项的 cookie Menu ul class nav nav pills li class active a href Customers a li li a href Statics a li li a hr
  • Ajax 请求返回 HTTP 错误 500,使用 MVC 和 $.ajax 调用 POST?

    我已经看到了几个关于此的主题 并且我已经尝试了所有答案 ASP NET MVC JsonResult 返回 500 https stackoverflow com questions 3113952 asp net mvc jsonresu
  • 在没有 Flash 的情况下用 HTML / js 录制音频?

    从麦克风录制音频并将 ajax 发回服务器 真的不知道如何在 Flash 中做到这一点 并希望它保持简单 目前还没有浏览器实现WHATWG 设备 API http www whatwg org specs web apps current
  • Backbone.View:delegateEvents 未将事件重新绑定到子视图

    我已将这个问题分解为尽可能小的示例 即 它只是为了演示问题 不一定代表现实世界的场景 假设我有一个父视图 此处为 MainView 其中包含一个子视图 此处为 SubView 如果在任何时候我需要重新渲染父视图 从而重新渲染子视图 我就会丢
  • Bootstrap 多选限制问题

    我使用创建了一个多选下拉列表引导多选 http davidstutz github io bootstrap multiselect 我需要在选项选择中设置一个限制 这里我将其设置为 5 如果达到限制 我只需禁用其他选择选项 它就可以完美工
  • 检测滚动到 DIV 底部

    我想检测我是否到达了 div 的底部 我的 div 高度为 400px 溢出隐藏 我不知道正常高度但超过400px 我正在使用这段代码 但它不起作用 任何想法 if article txt scrollTop article txt hei
  • 如何通过JQuery从不带扩展名的URL中获取页面名称

    我有一个网址 http www example com keyword category php or http www example com keyword category php 4 我需要一个神奇的咒语 它只给我页面名称categ
  • 如何将 JSLint 用于依赖于 JQuery 的代码段?

    我对 Javascript 比较陌生 我想通过 JSLint 运行我周末玩的那段代码 这样它就可以指出我在哪里是个十足的白痴 不幸的是 我收到了大量关于缺少函数声明的错误 这些函数声明是 JQuery javascript 库及其各种插件的

随机推荐

  • 可选类型“$T11”不能用作布尔值;自安装 XCode 6 beta 7 以来测试 '!= nil'

    这是我收到错误的代码 for key value in info let fieldValue AnyObject value if fieldValue fieldValue length 0 this line gives the er
  • 如何从另一个 Windows 应用程序获取 Chrome 28 的当前 URL?

    在 Chrome V27 之前 您可以枚举 Chrome 子窗口控件以访问编辑字段并从那里读取字符串值以获取当前打开的 URL 不幸的是 Chrome 28已经切换到新的渲染引擎 Blink 除了主窗口 Chrome WidgetWin 1
  • 使用 cin 将输入作为函数参数传递

    我的程序 class test int k public void changeval int i k i int main test obj int i cin gt gt i obj changeval i return 0 有什么方法
  • char* 和 int* 之间的区别

    有什么区别char and int 当然 它们是不同类型的 但我怎么能写 char s1 hello world as hello world 它不是一个字符 而是一组字符 我不能写 s1 as char s1 h e l l o w o
  • Java中两个List的有效交集?

    问题很简单 我有两个列表 List
  • “.equals”和“==”有什么区别? [复制]

    这个问题在这里已经有答案了 我今天换了讲师 他对我说使用了一个奇怪的代码 他说最好用 equals当我问为什么时 他回答说 因为是这样 这是一个例子 if o1 equals o2 System out println Both integ
  • jQuery 上下文菜单 - 查找触发它的元素

    我正在尝试为我的页面编写一个上下文菜单选项 基本上 右键单击 div 会弹出一个选项菜单 可用于执行任务 我的问题是试图找到触发所有内容的原始元素 即右键单击的 div 我的 jQuery 代码或多或少是 this is what disp
  • 用 Java 创建自定义 JButton

    有没有办法创建一个JButton使用您自己的按钮图形而不仅仅是按钮内的图像 如果没有 是否有其他方法来创建自定义JButton在java中 当我第一次学习 Java 时 我们必须制作 Yahtzee 我认为创建自定义 Swing 组件和容器
  • 使用 Firebase 获取 downloadURL 不断抛出错误“XMLHttpRequest 未定义”

    当尝试获取刚刚上传到存储的图像的 downloadURL 时 我不断收到 XMLHttpRequest 未定义 消息 对这里发生的事情有什么想法吗 我可以检索元数据 但图像 url 未在方案中列出 Node import firebase
  • 将具有唯一 id 属性的对象数组转换为 Map

    我有一个对象数组 其中每个对象都有一个名为的唯一成员id 如何创建地图id如果地图的钥匙 您想将数组减少为地图 const arr id 1 id 2 id 2 const map arr reduce acc item gt acc se
  • 如何从应用程序客户端连接远程 EJB 模块

    我的计算机上的远程 Glassfish 服务器和应用程序客户端中有一个 EJB 模块 我想从应用程序客户端连接到远程 EJB 这是我的 EJB 界面 Remote public interface BookEJBRemote public
  • 使用cowplot和ggplot2在某些行周围绘制边框

    我想以某种方式表明多面板图中的某些行应该一起比较 例如 我想绘制这个图 如下图所示 用 PowerPoint 制作的面板周围有方框 这是我为使用第一个图而编写的代码 我使用了ggplot和cowplot require cowplot th
  • 引用变量存储在哪里[重复]

    这个问题在这里已经有答案了 我知道引用不会占用任何内存 它会指向它所引用的同一内存位置 例如 int i 10 int r a suppose i指向内存位置 1000 所以在这种情况下r也将指向内存位置 1000 但在 C 中 每当我们声
  • MongoCursor 中的 Limit 和 BatchSize 有什么区别?

    MongoDB 游标对象提供了BatchSize财产and and Limit属性 但我似乎找不到任何明确的信息来正确阐明两者之间的区别 我正在使用 Net 驱动程序 因为它物有所值 限制是您想要的结果总数 如果您的查询将返回 1000 个
  • 有人知道 OOP PHP 的良好培训资源吗?

    我想看看大家是否可以分享一些关于 PHP 语言的 OOP 的好的培训资源 有人知道 OOP 面向对象编程 PHP 的良好培训资源吗 我看过很多教程 大部分都是肤浅的 其中一些很糟糕 Please分享任何好的商业或免费 视频或书面内容 我喜欢
  • 如何手动设置 gradle-2.2.1-all.zip

    我想用这个命令运行我的单元测试 gradlew bat connectedInstrumentTest 但它尝试下载https services gradle org distributions gradle 2 2 1 all zip 我
  • 从 JavaScript 调用 ASP.NET MVC 操作方法

    我有这样的示例代码 div class cart a class button span Add to Cart span a div div class wishlist a Add to Wish List a div div clas
  • 如何在Scala中实例化Unit?

    我所希望的只是使用一些并发集 似乎根本不存在 Java用途java util concurrent ConcurrentHashMap
  • “保护”文本框值不被输入(HTML 表单)

    我想知道是否可以为 HTML 文本框分配一个值并保护它 我的意思是使其内容不可修改 这样当提交表单时我 确定 提交的是这个值 顺便说一句 我意识到更简单的方法是不 监听 此输入并仅分配它 但它会派上用场 能够执行上述操作 我希望这个问题足够
  • 使用jquery自动打印

    我有以下格式的数据 虚拟条目 id posGridView 当我处理销售时 会自动打印一张小收据 其中包含选定的列 而不是所有列 因为所有数据都在此网格视图中可用 所以如何使用 jquery 以任何格式动态打印它 Edited 实际上我想从