Question

我有一个创建iframe的方法，将文本框的内容复制到该iframe，打印iframe，然后删除iframe：

function CentralPrint(controlID)
{
    var frameSet = document.createElement('iframe');

    frameSet.name = "frameSet";
    frameSet.id = "ErrorReportPrintingFrame";
    frameSet.style.position = "absolute";
    frameSet.style.top = "-1000000px";
    document.body.appendChild(frameSet);

    var frameDoc = frameSet.contentWindow ? frameSet.contentWindow : frameSet.contentDocument.document ? frameSet.contentDocument.document : frameSet.contentDocument;
    frameDoc.document.open();

    var content = document.getElementById(controlID).value.replace(/\n/gi, '<br>');

    frameDoc.document.write('<html><head><title></title><table><tr><td>');
    frameDoc.document.write(' <style type="text/css"> table tr td { font-family: Arial,Helvetica,sans-serif; } </style> </head><body>');
    frameDoc.document.write(content);
    frameDoc.document.write('</td> </tr> </table> </body></html>');

    frameDoc.document.close();

    var iframe = document.getElementById("ErrorReportPrintingFrame");
    var result = iframe.contentWindow.document.execCommand("print", false, null);

    if (!result)
    {
        iframe.contentWindow.print();
    }

    document.body.removeChild(frameSet);

    return false;
}

这适用于IE 11，Chrome，它适用于Firefox 如果我设置了断点并逐步执行代码。

我不认为这是相关的，但当我通过IE＆amp; Chrome，result为true，在Firefox中，result为false。

除非我在Firefox中设置断点，否则我不会选择弹出设备。

知道可能导致这种情况的原因吗？

Answer 1

我找到了一个解决方案，但为什么它解决了这个问题超出了我的范围：

function CentralPrint(controlID)
{
    // New variable
    var isFirefox = typeof InstallTrigger !== 'undefined';

    var frameSet = document.createElement('iframe');

    frameSet.name = "frameSet";
    frameSet.id = "ErrorReportPrintingFrame";
    frameSet.style.position = "absolute";
    frameSet.style.top = "-1000000px";
    document.body.appendChild(frameSet);

    var frameDoc = frameSet.contentWindow ? frameSet.contentWindow : frameSet.contentDocument.document ? frameSet.contentDocument.document : frameSet.contentDocument;
    frameDoc.document.open();

    var content = document.getElementById(controlID).value.replace(/\n/gi, '<br>');

    frameDoc.document.write('<html><head><title></title><table><tr><td>');
    frameDoc.document.write(' <style type="text/css"> table tr td { font-family: Arial,Helvetica,sans-serif; } </style> </head><body>');
    frameDoc.document.write(content);
    frameDoc.document.write('</td> </tr> </table> </body></html>');

    frameDoc.document.close();

    // Use a timeout function instead of just issuing the command immediately
    setTimeout(function ()
    {
        var iframe = document.getElementById("ErrorReportPrintingFrame");

        if (isFirefox != true)
            iframe.contentWindow.document.execCommand("print", false, null);
        else
            iframe.contentWindow.print();

        document.body.removeChild(frameSet);
    }, 500);

    return false;
}

我想在打印命令执行它需要做的事情之前删除元素一定是个奇怪的问题？

Answer 2

此类问题称为race condition。您正在尝试在加载完成之前获取元素。

您可以向onLoad添加frameSet事件监听器，而不是使用超时。

frameSet.onload = function() {
  var iframe = document.getElementById("ErrorReportPrintingFrame");
  ...
};

或者，如果你喜欢超时，你很可能会将其减少到0，它仍然会有效。

除非我设置断点，否则Firefox不会打印？

2 个答案: