HTML 类在 Div 的点击事件未被调用

Question

我正在尝试编写一个发送通知功能，其中通知显示在右上角，就像 OS X 通知一样。我没有使用库来执行此操作，而是使用 jquery 作为资源。

我有一个名为 #notifications 的通知容器。我在向我的网站发送通知时附加的内容

通知正在按要求很好地发送和堆叠，但是我需要记录一个 onclick 事件，以便它们在单击时淡出并且下方的任何通知向上移动。它们都有动态 id，并且网站上可能同时有无限数量的通知（永远不会有，但原理是有的）。

我尝试使用 .bind()、.click()、.live() 和 .on()，但其中 none 似乎有效。

我的使用方式是这样的：

$('.notification').bind('click', function()
{
    // CODE HERE
}

通知 class 只在通知的周围容器上出现，如下所示：

<div class="notification"><p>Message here</p></div>

请帮帮我:)

Answer 1

不要在通知 class 上使用绑定，在 children 上使用它：

$('#notifications').children('.notification').on('click', function() {
    // some stuff
})
$('#notifications').on('click', '.notitfication' function() {
    // this should work too
})

Answer 2

问题是注册事件时元素尚未创建。

如果我没理解错的话，你是这样的：

<div id="notifications">
    <div id="some-dynamic-id" class="notification"></div>
</div>

如果正确，您应该像这样注册事件：

$(function() {
    $("#notifications").on("click", ".notification", function() {
        //your code
    });
});

我知道你试过 .on()，但我相信你试过 $(".notification")。请注意，这里我假设 #notifications 在您注册事件时已经存在。

编辑：$(function() {}); //do be, or not to be

在事件定义周围添加了 $(function() {}); 部分，以处理调用 .on() 时 #notifications 不存在的可能情况。它基本上是在加载文档时发出声音。

HTML 类在 Div 的点击事件未被调用

On Click Event for HTML Classes on Div not being called

html

jquery

notifications

onclick

HTML 类 在 Div 的点击事件未被调用

On Click Event for HTML Classes on Div not being called

html

jquery

notifications

onclick

HTML 类在 Div 的点击事件未被调用