首页 > 解决方案 > 在新窗口中打开图像出现javascript的空白页面

问题描述

从这个答案中获取参考后

在新窗口中打开图片

我做了同样的代码。

function openImage() {
    var largeImage = document.getElementById('viewImage');
    largeImage.style.display = 'block';
    largeImage.style.width = 200 + "px";
    largeImage.style.height = 200 + "px";
    var url = largeImage.getAttribute('src');
    window.open(url, 'Image', 'width=largeImage.stylewidth,height=largeImage.style.height,resizable=1');
}

但是当这个函数执行时,当我在控制台中查看图像 src 时显示空白页面,它显示了正确的数据。在此处输入图像描述

我的 img 元素也正确地显示了我的图像, 在此处输入图像描述

但这就是我的页面的显示方式在此处输入代码

你认为我的代码有什么问题?

标签: javascripthtmlimagewindow

解决方案


该解决方案适用于实际 url 作为 src 的图像,在您的情况下,图像 src 是 base64 编码的字符串而不是 url。

Window.open 的 Base64 支持在所有浏览器中都不相同,它适用于 firefox,但不适用于 chrome 和 IE。

所以,你可以试试这个

function openImage() {
    var largeImage = document.getElementById('viewImage');
    largeImage.style.display = 'block';
    largeImage.style.width = 200 + "px";
    largeImage.style.height = 200 + "px";

    var w = window.open("");
    w.document.write(largeImage.outerHTML);
}

推荐阅读