本文介绍如何利用隐藏的iframe与JavaScript的execCommand方法,实现点击链接时触发浏览器的“图片另存为”对话框,而非直接在当前窗口打开图片。该方法通过模拟用户操作完成文件保存功能。
创建隐藏iframe加载图片
<iframe height="0" width="0" src="/images/logo.gif" name="saveImage" id="saveImage"></iframe>
通过execCommand触发保存
接着,添加一个链接元素,其href属性设为###以避免页面跳转。在onclick事件中调用saveImage.document.execCommand('saveAs')方法。当用户点击该链接时,浏览器会尝试对iframe中加载的图片执行保存操作,从而弹出“图片另存为”对话框。