单击“查看”按钮时，在弹出/新选项卡/窗口中显示图像

Question

这里是我试过的代码。 * val是一个变量，它将为多个图像调用theFunction() 。

<th style="color:#cc0000">Fail</th><td><a href="javascript:void();" id="img8" class="hide\  value="show my Image" onclick="return theFunction(8);">view</a>

<img id="myimage8" class="hide" src="image1.jpg"  alt="check image path" width="100px" height="100px">

<img id="myimage_8" class="hide" src="image2.jpg" alt="check image path" width="100px" height="100px"></td>
<script>
function theFunction(val) {
  obj0=document.getElementById('img'.concat(val)); 
  obj1 = document.getElementById('myimage'.concat(val));
  obj2 = document.getElementById('myimage_'.concat(+val));
  obj1.className=='hide'? (obj1.className='',this.value='hide my Image'): (obj1.className='hide',this.value='show my Image'); 
  obj2.className=='hide'? (obj2.className='',this.value='hide my Image'): (obj2.className='hide',this.value='show my Image');
  return true;
}
window.addEventListener? window.addEventListener('load',theFunction,false): window.attachEvent('onload',theFunction); 
</script>

实际结果：

单击“视图”按钮后显示图像

预期：

图像将显示在弹出窗口中。

我试过了， target="_blank"但它没有用。 有人建议使用windows.open() ，但我不知道如何调用它。 有人可以帮我解决这个问题吗？

Answer 1

您可以使用window.open打开新URL。 如果您的图像可通过消费者可访问的URL获得，您可以执行以下操作：

window.open(image-url)

当用户点击它时，它将在新窗口中打开您的图像

还有一个更好的选择。 我建议您在弹出窗口中显示图像而不进行任何重定向。 您可以轻松地使用bootstrap模型弹出窗口。 请参阅此参考。