如何打印整个 bootstrap 模态,其中模态正文中的内容被滚动到视图之外 [英] How do I print the entire bootstrap modal where content in modal body is scrolled out of view

查看:19
本文介绍了如何打印整个 bootstrap 模态,其中模态正文中的内容被滚动到视图之外的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问题是用户必须向下滚动才能查看模态正文中的所有内容.但是,当我打印模态时,唯一打印的部分是可见部分.我希望打印整个模态的内容.我已经尝试了下一页上的每一段代码,但没有一个打印整个模态.

Twitter Bootstrap:打印模态窗口的内容

解决方案

从以下链接下载 printThis.js 并将其包含在您的 html 中:https://github.com/jasonday/printThis/blob/0a7f799693af8a8303bf0b8df0efc80c2694afjs81>This

用下面的div包裹你要打印的内容.不会打印此 div 之外的所有内容.

..要打印的内容..

调用以下jquery打印所有内容,包括不可见的内容.如果您有多个 css 文件,您可以将您的 css 文件包含在一个数组中.

$("#modalDiv").printThis({调试:假,导入CSS:真,进口风格:真实,打印容器:真,loadCSS: "../css/style.css",pageTitle: "我的模态",删除内联:假,打印延迟:333,标题:空,表单值:真});

The problem is that the user has to scroll down to view all of the content within the modal body. However, when I print the modal the only part that is printed is the part that is viewable. I want the entire modal's content to be printed. I have tried every piece of code on the following page and none of them print the entire modal.

Twitter Bootstrap: Print content of modal window

解决方案

Download printThis.js from the following link and include it in your html: https://github.com/jasonday/printThis/blob/0a7f799693af8a8303bf0b8df0efc80c2694af81/printThis.js

Wrap the content you want to print with the following div. Everything outside of this div will not be printed.

<div id="modalDiv">
    ..content to print..
</div>

Call the following jquery to print all the content including the content that is not viewable. You may include your css files in an array if you have multiple css files.

$("#modalDiv").printThis({ 
    debug: false,              
    importCSS: true,             
    importStyle: true,         
    printContainer: true,       
    loadCSS: "../css/style.css", 
    pageTitle: "My Modal",             
    removeInline: false,        
    printDelay: 333,            
    header: null,             
    formValues: true          
}); 

这篇关于如何打印整个 bootstrap 模态,其中模态正文中的内容被滚动到视图之外的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆