Question

我使用简单的css和js在单击图像时将图像显示为弹出窗口，并在顶部关闭按钮以关闭图像。 openimage和closeimage都是js函数我已实施为打开图像功能

function imgv(x,y,img)
{
     document.getElementById('imgv_i2').src = img;
     document.getElementById('imgv_i2').style.width = x;
     document.getElementById('imgv_i2').style.height = y;
     document.getElementById('imgv_i2').width = x;
     document.getElementById('imgv_i2').height = y;
    imgToMiddle('imgv_i2');
    document.getElementById('imgv_i2').style.display = 'block';
}

关闭图片

function closeimgv()
{
    document.getElementById('imgv_i2').style.display = 'none';
    document.getElementById('imgv_close').style.display = 'none';
}

事件为

<a href="javascript:void(0);"  onclick="imgv(101,101,'image url');"><img src="image src"></a>

现在在外面点击时关闭图片我使用了these

$('#imgv_i2').click(function(event){
    event.stopPropagation();
});
$('html').click(function() {
if(document.getElementById('imgv_i2').style.display == 'block') {
            closeimgv();
    }
});

现在发生的情况是，当点击触摸打开图像时，关闭图像功能也触发了如何在触发打开图像功能后进行$('html').click();绑定，并在关闭图像功能后取消绑定。感谢。

Answer 1

尝试

$(document).click(function(ev) {
    //avoid clicks on image itself
    if($(ev.originalTarget).is("whatever triggers image opening")) {return;} 

    if(document.getElementById('imgv_i2').style.display == 'block') {
            closeimgv();
    }
});

Answer 2

我建议您使用jquery插件进行厚盒或弹出，因为它们非常简单，易于实现和自定义。有许多开源插件可供试用，它们确实提供了您要求的定制类型！

单击外部$（'html'）时关闭图像。单击（）;与开放形象冲突？

2 个答案: