“将图像另存为..”在使用 window.open() 和 document.write() 时无法在 Google Chrome 中运行
Posted
技术标签:
【中文标题】“将图像另存为..”在使用 window.open() 和 document.write() 时无法在 Google Chrome 中运行【英文标题】："Save image as.." not working in Google Chrome when using window.open() and document.write() 【发布时间】：2017-03-31 08:34:12 【问题描述】：在我的应用程序中，我需要允许用户右键单击图像以将图像保存到磁盘。但是，我注意到使用我的特定代码，谷歌浏览器是唯一不允许用户“将图像另存为..”的浏览器，除非用户首先选择 Open image in new tab，然后从那里选择 @987654322 @。
由于所有其他主要浏览器（包括移动 Chrome）都按预期工作，我不确定我是否没有以标准/正确的方式实现我的代码，或者问题出在 Chrome 上。
示例：
以下 html 是我正在做的精简版。它将允许您单击一个按钮以打开一个包含图像的新窗口。
要测试/确认我上面描述的问题，右键单击图像并选择Save image as.. - 您应该注意到没有任何反应。但是，如果您右键单击图像并选择Open image in new tab，您将能够从那里Save image as..。
<html>
<head>
<title></title>
<script>
function foo()
var tab = window.open();
tab.document.write('<p>Right-click, then click "Save image as ..."</p><img src="http://cdn.sstatic.net/Sites/***/company/img/logos/so/so-icon.png" />');
</script>
</head>
<body>
<button onclick="foo();">Open</button>
</body>
</html>
这是 Chrome 的问题，还是我可以使用 window.open() 和 document.write() 让 Chrome 像其他浏览器一样工作（即不必首先选择 Open image in new tab。
【问题讨论】：
【参考方案1】：我找到了一个似乎可行的解决方案。使选项卡具有位置属性。我不确定为什么需要这样做，但它适用于 Chrome 48。
document.write('<html>
<head>
<title></title>
<script>
function foo()
var tab = window.open();
tab.document.write('<p>Right-click, then click "Save image as ..."</p><img src="http://cdn.sstatic.net/Sites/***/company/img/logos/so/so-icon.png" />');
tab.document.location = "#";
</script>
</head>
<body>
<button onclick="foo();">Open</button>
</body>
</html>');
【讨论】：
我必须设置window.location.href = "#" 然后它对我有用。我正在使用 TypeScript。
感谢这个解决方案很好用！ about:blank url 消失了，现在我看到我的页面链接末尾带有哈希。
谢谢！谢谢！几年来我遇到了完全相同的问题，但无法弄清楚如何治愈它。我想知道为什么这应该起作用？但是没关系。确实如此！伊皮以上是关于“将图像另存为..”在使用 window.open() 和 document.write() 时无法在 Google Chrome 中运行的主要内容，如果未能解决你的问题，请参考以下文章