单击查看按钮时,在弹出窗口/新标签/窗口中显示图像

时间:2019-06-10 09:27:46

标签: javascript html

这是我尝试过的代码。 * 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(),但我不知道如何称呼它。有人可以帮我解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

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

window.open(image-url)

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

不过,还有一个更好的选择。我建议您在没有任何重定向的弹出窗口中显示图像。您可以轻松地使用引导程序模型弹出窗口。请参阅this以供参考。