时间戳

首页 > 解决方案 > 在调查仪表板中弹出图像

javascript - 在调查仪表板中弹出图像

问题描述

我正在设置一个调查仪表板，并希望能够单击图像以在另一个窗口中打开。这可以正常工作，但是如果我单击多个图像，我会打开许多​​不同的窗口。有没有办法让它在我单击新图像时关闭窗口并打开新窗口？

我可以在单独的新窗口中打开图像。

代码如下所示：


<a href="javascript:void(0)" onclick="$(this).next('div').clone().dialog({width:550,height:640});"><img src="image1.jpg" width="100" height="100" align="right"/></a><div style="display:none;"><img src="image1.jpg" style="max-width:500px;max-height:500px;"></img></div>

<a href="javascript:void(0)" onclick="$(this).next('div').clone().dialog({width:550,height:640});"><img src="image2.jpg" width="100" height="100" align="right"/></a><div style="display:none;"><img src="image2.jpg" style="max-width:500px;max-height:500px;"></img></div>

<a href="javascript:void(0)" onclick="$(this).next('div').clone().dialog({width:550,height:640});"><img src="image3.jpg" width="100" height="100" align="right"/></a><div style="display:none;"><img src="image3.jpg" style="max-width:500px;max-height:500px;"></img></div>

<a href="javascript:void(0)" onclick="$(this).next('div').clone().dialog({width:550,height:640});"><img src="image4.jpg" width="100" height="100" align="right"/></a><div style="display:none;"><img src="image4.jpg" style="max-width:500px;max-height:500px;"></img></div>

当您打开新图像或让新图像替换旧图像时，希望关闭一个图像窗口。

标签： javascripthtml

解决方案

不可以。创建一个新窗口后，当您单击另一个图像时，您将无法关闭它。这是不可能的。

您可以在同一窗口中显示图像，而不是创建新窗口。

请尝试以下方法。

  1. 模态图像 https://www.w3schools.com/howto/howto_css_modal_images.asp

  2. 灯箱 https://www.w3schools.com/howto/howto_js_lightbox.asp

  3. 图片库 https://www.w3schools.com/howto/howto_js_tab_img_gallery.asp

推荐阅读