`
ctrain
  • 浏览: 135506 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

window.print分页打印

 
阅读更多
function init() {
    var tt = document.getElementById("tt");
    var childNodes = tt.childNodes[0].childNodes;
    var level = 0;
    for (var i = 0; i < childNodes.length; i++) {
        var topHeight = childNodes[i].offsetTop - childNodes[i].scrollTop;
        var pageHeight = topHeight - level;
        //暂定高度为850px时进行分页,高度大于850px,则该tr被分到下一页
        //appendBefore
        if (pageHeight > 850) {
            var pageTr = document.createElement("tr");
            pageTr.style.pageBreakAfter = "always";
            var tmpTr = document.createElement("tr");
            childNodes[i].parentNode.insertBefore(tmpTr, childNodes[i]);
            childNodes[i].parentNode.insertBefore(pageTr, childNodes[i]);
            level = childNodes[i - 1].offsetTop - childNodes[i - 1].scrollTop;
            console.log("当前level为:" + topHeight + ", 当前tr索引为:" + (i + 1));
        }
    }
}
分享到:
评论

相关推荐

    原生JS打印插件之jQuery.EasyPrint.js使用文档

    调用浏览器自带打印功能,使用JavaScript的 window.print(); 方法。 使用JS实现打印功能;JavaScript 实现打印操作;javascript打印大全;通用;js实现打印的方式;JS怎么实现页面打印呢?JavaScript 实现打印,打印...

    JS 使用 window对象的print方法实现分页打印功能

    总而言之,使用window对象的print方法,结合CSS属性来控制分页,是一种有效实现Web打印的方式。这种方法不仅可以帮助开发者实现复杂的打印需求,还具有良好的跨浏览器兼容性。但需要提醒的是,实际应用时应考虑用户...

    jqprint可分页打印页面内容

    "jqPrint" 是一个基于jQuery的插件,它允许开发者方便地实现页面内容的分页打印功能,无需复杂的CSS调整或JavaScript编程。在本篇中,我们将深入探讨如何使用jqPrint实现这一目标,以及涉及到的相关技术。 首先,...

    JS 实现web分页打印功能

    本篇将详细介绍如何利用JS的`Window`对象的`print()`方法来实现一个具有强大兼容性的分页打印功能。 首先,`Window.print()`方法是JavaScript中用于调用浏览器内置的打印对话框的函数,用户可以在该对话框中选择...

    VUE打印demo,自动分页

    CSS的`@media print`规则可以用来定义打印样式,例如隐藏不必要的元素,调整页面边距,以及控制分页断点。在Vue组件中,我们可以动态地添加或修改这些样式,以便在用户触发打印时应用。 `vue-print-nb`是一个常用的...

    js分页批量打印例子并去掉页码和下面的地址

    1. **JS批量打印**:JavaScript 提供了 `window.print()` 方法来触发浏览器的打印功能。通过在 JavaScript 代码中调用这个方法,可以实现网页内容的批量打印。但是,`window.print()` 默认会打印整个网页,包括不必...

    一种Windows系统下连续不分页打印的方法

    ### 一种Windows系统下连续不分页打印的方法 #### 技术背景与问题 在传统的打印方式中,大多数采用的是分页打印模式。这种方式虽然简单易用,但在某些场景下却存在明显的不足,尤其是在处理长表格或者需要连续打印...

    Web分页打印 细线表格+分页打印之终极攻略

    最近给客户做打印的时候,客户提出打印时不要打印该页面的头,只是打印表格里面的内容,因为头部有背景和打印按钮,而且要细线表格的那种,我想细线表格不是很简单吗 如果你还不知道细线表格怎么做,请看下面的代码...

    js分页批量打印例子

    在JavaScript中,打印功能通常通过window.print()函数来实现,它会打开浏览器的打印对话框。但是,如果直接使用此函数,只能打印当前可见的内容。为了实现批量打印,我们需要创建一个临时的HTML文档,将所有需要打印...

    在线打印功能

    这项功能的实现基于浏览器提供的JavaScript API,如`window.print()`方法,结合CSS样式控制,以确保打印内容的布局和样式与在屏幕上显示的一致。 首先,我们要理解在线打印功能的核心在于JavaScript。在JavaScript...

    chrome浏览器实现打印预览打印功能.zip

    在提供的资源中,`jquery.PrintArea.js实现局部打印+分页.url`指向了该插件的实现示例,可以参考学习。 为了实现更好的分页效果,Web开发者通常会借助CSS和HTML布局技术。`真正好用的网页打印和分页方法-CSS+DIV或...

    JS 实现分页打印功能

    在调用window.print()时,可以实现打印效果,但内容太多时要进行分页打印。 在样式中有规定几个打印的样式 page-break-before和page-break-after CSS属性并不会修改网页在屏幕上的显示,这两个属性是用来控制文件的...

    js 前端打印demo

    首先,JavaScript作为客户端脚本语言,它可以通过`window.print()`函数来触发浏览器的打印操作。这个方法会弹出一个打印预览窗口,用户可以选择打印机、页边距、纸张大小等设置。然而,`window.print()`默认会打印...

    jquery分页打印

    2. **使用`window.print()`**:当用户触发打印操作时,可以通过调用`window.print()`函数来启动打印对话框,让用户选择打印机设置。 3. **媒体查询**:利用CSS媒体查询(`@media print`),可以为打印场景定制样式...

    打印自动分页.zip

    用户在打印前查看预览是非常重要的,可以通过`window.print()`来调用浏览器的打印对话框,但需要注意的是,预览可能不会完全反映出实际打印的效果,因为用户可以在打印对话框中调整设置。因此,建议在页面上提供一个...

    jquery打印HTML表格自动分页

    6. **处理打印事件**:当用户点击打印按钮时,可以通过`window.print()`方法启动打印对话框。在打印之前,可以使用CSS来调整打印页面的布局,比如隐藏不需要打印的元素,调整分页表格的样式等。 7. **清理**:在...

    网页打印,调用系统打印预览,方便简单

    1. `window.print()`:这是JavaScript中最基本的打印方法,调用`window.print()`会触发浏览器的默认打印对话框,用户可以选择打印机、页面范围和打印设置。但这种方法不能自定义打印样式或排除某些元素。 2. CSS...

    利用javascript实现网页打印

    总的来说,利用JavaScript实现网页打印涉及到`window.print()`方法、CSS媒体查询和打印相关的CSS属性。通过这些技术,我们可以定制打印内容,隐藏不需要的元素,调整页面布局,并控制分页。为了优化打印体验,还需要...

    调用浏览器中的打印功能

    在调用`window.print()`之前,可以通过CSS媒体查询(@media print)来定义打印样式,以确保打印时的布局和外观符合预期。 接着,我们讨论分页打印。在HTML中,可以通过CSS的`page-break-after`和`page-break-before...

Global site tag (gtag.js) - Google Analytics