Question

我正在尝试关闭我在用户点击时添加的叠加层。关闭按钮可以工作，但不能覆盖。叠加层会自动关闭。我会假设下面的内容可行，但不行。我错过了什么吗？

(function (a) {
a.sticky = function (b, c, d) {
    return a.fn.sticky(b, c, d)
};
a.fn.sticky = function (b, c, d) {
    var e = "top-right";
    var f = {
        speed: "slow",
        duplicates: true,
        autoclose: 2200
    };
    if (!b) {
        b = this.html()
    }
    if (c) {
        a.extend(f, c)
    }
    var g = true;
    var h = "no";
    var i = Math.floor(Math.random() * 99999);
    a(".sticky-note").each(function () {
        if (a(this).html() == b && a(this).is(":visible")) {
            h = "yes";
            if (!f["duplicates"]) {
                g = false
            }
        }
        if (a(this).attr("id") == i) {
            i = Math.floor(Math.random() * 9999999)
        }
    });
    if (!a("body").find(".sticky-queue").html()) {
        a("body").append('<div class="sticky_overlay"><div class="sticky-queue"></div></div>')
    }
    if (g) {
        a(".sticky-queue").prepend('<div class="sticky border-' + e + '" id="' + i + '"></div>');
        a("#" + i).append('<img src="images/close.png" class="sticky-close" rel="' + i + '" title="Close" />');
        a("#" + i).append('<div class="sticky-note" rel="' + i + '">' + b + "</div>");
        var j = a("#" + i).height();
        a("#" + i).css("height", j);
        a("#" + i).hide().fadeIn(f["speed"]);
        g = true
    }
    a(".sticky").ready(function () {
        if (f["autoclose"]) {
            a("#" + i).delay(f["autoclose"]).fadeOut(f["speed"]);
            a(".sticky_overlay").delay(f["autoclose"]).fadeOut(f["speed"]);
        }
    });
    a(".sticky-close").click(function () {
        a(".sticky_overlay").dequeue().fadeOut(f["speed"]);
    });
//--- this is where I'm trying to close by clicking the overlay ---//
a(".sticky_overlay").click(function () {
        a(".sticky_overlay").dequeue().fadeOut(f["speed"]);
    });
//--- this is where I'm trying to close by clicking the overlay ---//
    var k = {
        id: i,
        duplicate: h,
        displayed: g,
        position: e
    };
    if (d) {
        d(k)
    } else {
        return k
    }
}
})(jQuery);

它显示的HTML：

<div class="sticky_overlay" style="display: block;">
 <div class="sticky-queue">
  <div class="sticky border-top-right" id="79528" style="height: 40px; display: block;">
   <img src="images/close.png" class="sticky-close" rel="79528" title="Close">
   <div class="sticky-note" rel="79528">
    <div class="messages status_green">Project created!</div>
   </div>
  </div>
 </div>
</div>

Answer 1

尝试将.click()更改为.live() ooorrrr，例如N Rohler指出使用.on()。以下是文档的链接：

http://api.jquery.com/live/

http://api.jquery.com/on/

单击时关闭叠加

1 个答案: