javascript - 单击事件未使用 ON 触发？

Question

当我单击任何按钮时，click 事件不会被触发。艰难的是，我使用 $("div").on("click", "button", function () { 让它工作，但我想看到它使用 .class 工作> 选择器。

ON 的语法:

.on( events [, selector ] [, data ], handler )

HTML:

<div>
    <button class='alert'>Alert!</button>
</div>

代码:

$(document).ready(function () {
    $("div button").on("click", ".alert", function () {
        console.log("A button with the alert class was clicked!");
    });
    $("<button class='alert'>Alert!</button>").appendTo("div");
});

sample 工作 here

这可能是基本的，但我正在认真地开始尝试和理解一些概念。帮助我理解。

Answer 1

您当前的代码正在尝试委托(delegate)按钮中具有类警报的元素的事件。不存在的。

如果您尝试委托(delegate)带有类警报的按钮的事件，您需要使用:

$("div").on("click", "button.alert", function () {
    console.log("A button with the alert class was clicked!");
});

<强> Working Demo