动态创建的 div 的 onclick 事件

Posted 2023-03-12

【中文标题】动态创建的 div 的 onclick 事件

【英文标题】：onclick event for a dynamically created div

【发布时间】：2014-12-28 08:43:41

【问题描述】：

我正在使用一个名为 Soundmanager2 的 jQuery 音频播放器插件 它在 DOM 中动态地广告播放按钮。 我正在尝试为这个按钮添加 onclick 事件。

html

<div class="ui360"><a href="track1.m4a">Track1</a></div>

在 DOM 中动态添加按钮后，它看起来像这样

<div class="ui360">
<div class="sm2-360ui"><canvas class="sm2-canvas hi-dpi"  ></canvas> <span class="sm2-360btn sm2-360btn-default"></span> <div class="sm2-timing alignTweak"></div> <div class="sm2-cover"></div></div>
<a href="track1.m4a">Track1</a></div>

我的代码：

$('.sm2-360ui').live(click,function()
  alert("Playing");
);

【问题讨论】：

live 已死，只需检查 DOC... 就是说，你应该写它：$('.sm2-360ui').live("click",function()...);

【参考方案1】：

这称为事件“委托”

$(document).on('click','.sm2-360ui', function()
  alert("Playing");
);

【参考方案2】：

$('.ui360').on('click','.sm2-360ui',function()
  alert("Playing");
);

【讨论】：

效果很好！。谢谢！ :)