如何使事件可用于动态添加的html jquery?

Question

>我正在做一些第一次加载内容运行良好的过程，使用 -

$("#daily-table").find("td.user-slot").mousedown(function (e) {
Some Process 
}

但它不适用于动态添加的 html，在"每日表"标签中。这是我正在尝试动态添加的 html 的代码 -

$(document).on("mousedown", "#daily-table > td.user-slot" , function(e) { 
Some Process 
}

这是 HTML 结构 -

<table id="daily-table" class="slotsdata">
<tbody>
<tr class="tr-scheduled startTimeRow odd" >
<td class="timetitle time-slot"><span>10:00 AM</span></td>
<td class="user-slot" ><a href="#" data-toggle="modal" class="tx-white tx-11 tx-medium">Anchor1</a></td>
<td class="user-slot" ><a href="#" data-toggle="modal" class="tx-white tx-11 tx-medium">Anchor2</a></td>
</tr>
<tr class="tr-scheduled startTimeRow odd" >
<td class="timetitle time-slot"><span>11:00 AM</span></td>
<td class="user-slot" ><a href="#" data-toggle="modal" class="tx-white tx-11 tx-medium">Anchor3</a></td>
<td class="user-slot" ><a href="#" data-toggle="modal" class="tx-white tx-11 tx-medium">Anchor4</a></td>
</tr>
<tbody>

请帮我解决这个问题... 谢谢

Answer 1

你的td.user-slot元素不是#daily-table的直系后代，所以不要使用子组合器

$(document).on("mousedown", "#daily-table td.user-slot" , function(e) {
/* 'this' refers to the <td> DOM element */
const $td = $(this);
/* $td is now a jQuery collection containing the DOM element */
});

Answer 2

尝试如下：

$(document).on("mousedown", ".time-slot").function(e) { 
//Some Process 
};