[英]Display images in a popup/ new tab/window when View button is clicked
Here the code I have tried. 这里是我试过的代码。 *val is a variable and it
theFunction()
will be called for multiple images. * 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>
The actual result: 实际结果:
the images are displayed just after 'view' button when clicked 单击“视图”按钮后显示图像
Expected: 预期:
the images are to be displayed in a popup window. 图像将显示在弹出窗口中。
I tried, target="_blank"
but it is not working. 我试过了,
target="_blank"
但它没有用。 Someone suggested to use windows.open()
, but I don't know how to call it. 有人建议使用
windows.open()
,但我不知道如何调用它。 Can someone help me out to resolve this one? 有人可以帮我解决这个问题吗?
You can use window.open to open a new URL. 您可以使用window.open打开新URL。 If your image is available via a URL that is accessible to consumers, you can just do:
如果您的图像可通过消费者可访问的URL获得,您可以执行以下操作:
window.open(image-url)
When a user clicks it, it will open your image on a new window 当用户点击它时,它将在新窗口中打开您的图像
There is one more better option though. 还有一个更好的选择。 I suggest you display the image in a popup without any redirections.
我建议您在弹出窗口中显示图像而不进行任何重定向。 You can easily use bootstrap model popup for that.
您可以轻松地使用bootstrap模型弹出窗口。 See this for reference.
请参阅此参考。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.