Question

您好，在stackoverflow贡献者的帮助下，我创建了一个jquery点击，弹出和关闭按钮。

目前的问题是我试图让红色方块成为关闭的btn，如果你点击打开的方框关闭它也会关闭。

有人可以帮忙吗？

这是我的小提琴＆gt; http://jsfiddle.net/EtHbf/301/

$('#some-button').on('click', function () { 
    $('#overlay, #overlay-back').fadeIn(500); 
});

$('#overlay').on('click', function () { 
    $('#overlay, #overlay-back').fadeOut(500); 
});

$('.callme').on('click', function (e) { 
    e.stopPropagation();
});

Answer 1

只需将#overlay-back添加到您的第二个click功能

即可

$('#overlay, #overlay-back').on('click', function () { 
    $('#overlay, #overlay-back').fadeOut(500); 
});

<强> Update Fiddle

Answer 2

您还需要添加overlayback功能：

$('#overlay-back').on('click', function () { 
$('#overlay, #overlay-back').fadeOut(500); });

Fiddle

Answer 3

$('#some-button').on('click', function () { 
    $('#overlay, #overlay-back').fadeIn(500); 
});

$('#overlay').on('click', function () { 
    $('#overlay, #overlay-back').fadeOut(500); 
});

$('.callme').on('click', function (e) { 
    $('#overlay, #overlay-back').fadeOut(500); 
    e.stopPropagation();
});

http://jsfiddle.net/EtHbf/308/

Answer 4

您也可以使用fadeToggle()

$('#some-button, #overlay').on('click', function () { 
    $('#overlay, #overlay-back').fadeToggle(500); 
});

$('#overlay-back').on('click', function () { 
    $('.callme, #overlay-back').fadeOut(500); 
});

JFIDDLE

Jquery弹出关闭按钮

4 个答案: