jquery - jquery覆盖：关闭子覆盖而不关闭父

Question

我有一个从可点击图像调用的“父”覆盖。叠加层本身有一个图像、一个文本表、一个关闭按钮 (Close) 和“链接”，这些标记元素调用具有与父级相同格式的“子”叠加层，包括关闭按钮（尽管没有子“链接”本身）。

每次我单击“子”覆盖层上的关闭按钮时，即使我只希望孩子关闭，孩子和父母都会关闭。我认为这是因为 jquery 认为 close 事件是针对父母和孩子的，因为它们具有相同的标签和类名。

这是脚本：

<script type="text/javascript">
$(document).ready(function () {
    $('img[rel]').overlay({
        oneInstance: false
    });

    $('a[rel]').overlay({
        oneInstance: false,
        onLoad: function () {
            $('.close').click(function (event) {
                event.preventDefault();
                $('a[rel]').overlay().close();
            });
        }
    });
});
</script>

如您所见，我试图拦截孩子的关闭点击并只关闭孩子，但它不起作用。我究竟做错了什么？

Answer 1

改变

$('a[rel]').overlay({
    oneInstance: false,
    onLoad: function () {
        $('.close').click(function (event) {
            event.preventDefault();
            $('a[rel]').overlay().close();
        });
    }
});

至

$('a[rel]').each(function () {
    var that = $(this);
    that.overlay({
        oneInstance: false,
        onLoad: function () {
            $('.close').click(function (event) {
                event.preventDefault();
                that.overlay().close();
            });
        }
    });
});