javascript - 使用 JQuery 打开弹出窗口并打印

标签 javascript jquery printing popup lightbox

不久前,我使用 jQuery 创建了一个灯箱插件,可以将链接中指定的 url 加载到灯箱中。代码非常简单:

$('.readmore').each(function(i){
    $(this).popup();
});

链接看起来像这样:

<a class='readmore' href='view-details.php?Id=11'>TJ Kirchner</a>

该插件还可以接受宽度、高度、不同的 url 以及要传递的更多数据的参数。

我现在面临的问题是打印灯箱。我将其设置为灯箱的顶部有一个打印按钮。该链接将打开一个新窗口并打印该窗口。这一切都由灯箱插件控制。该代码如下所示:

$('.printBtn').bind('click',function() {
    var url = options.url + ( ( options.url.indexOf('?') < 0 && options.data != "" ) ? '?' : '&' ) + options.data;
    var thePopup = window.open( url, "Member Listing", "menubar=0,location=0,height=700,width=700" );
    thePopup.print();
});

问题是脚本似乎没有等到窗口加载。它想在窗口出现的那一刻打印出来。因此,如果我单击“取消”打印对话框,它会一次又一次地弹出,直到窗口加载。我第一次尝试打印时得到的是空白页。这可能是因为窗口没有完成加载。

我需要找到一种方法来更改之前的代码块,以便等到窗口加载后再打印。我觉得应该有一种简单的方法可以做到这一点,但我还没有找到它。要么,要么我需要找到一种更好的方法来打开弹出窗口并从父窗口中的灯箱脚本打印,而无需在弹出窗口中交替网页代码。

最佳答案

您应该将打印函数放在 view-details.php 文件中,并在文件加载后调用它,方法是使用

<body onload="window.print()"> 

$(document).ready(function () { 
  window.print(); 
});

关于javascript - 使用 JQuery 打开弹出窗口并打印,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2603465/

相关文章:

javascript - JavaScript 变量名的最大长度

javascript - Angular ng-repeat 忽略嵌套 ng-if

javascript - Jquery 在更改时获取 slider 值

javascript - Jquery 让 fadeIn 仅在图像加载后才工作

javascript - 为 Node JS 使用 IPP 时打印作业延迟

python - 不带换行符打印 (print 'a' ,) 打印一个空格,如何删除?

javascript - 带有 Javascript 函数的 HTML 复选框

javascript - 无法使用 Angular 从 HTML View 获取值到 Controller 。解决方案返回$scope变量未定义

jquery - 如何将 ruby​​ 变量传递给 jquery

arrays - 如何打印具有固定列宽的二维数组