jquery - Jquery .on('click') 函数

Question

我有以下内容：

$('th').on('click', '.sorting > span', function() {
    alert("hello world");
});

这段代码曾经可以工作，但我对我的网站进行了一些更改，现在它无法正常工作。这是我尝试将上述功能应用于的代码示例：

<th style="text-align: center; width: 381px; " class="sorting" role="columnheader" tabindex="0" aria-controls="devices" rowspan="1" colspan="1" aria-label="Device: activate to sort column ascending"><span class="btn btn-mini" style="width: 100px">Device<span id="i"></span></span></th>

这是按钮链接的图像和 X 射线分析：

编辑：好的，现在发生了一些非常有趣的事情！当我将上面的代码包装起来时， $(document).ready( function () {}我终于在单击排序列时看到了警报。但是，当单击排序列时，类更改为“sorting_asc”......但是当我再次单击按钮时，我仍然看到相同的警报......显然包装在文档准备好意味着jquery不知道更新的 DOM CSS。那么，什么可能导致文档就绪功能之外的功能停止工作？

Answer 1

在您的标记th元素中没有带有 class of 的后代元素，sorting并且您的 jQuery 选择器没有选择任何元素，您应该编写以下代码：

$('th.sorting').on('click', 'span', function() {
    alert("hello world");
})

Answer 2

问题是当您真正的意思是“跨度”时，您正在使用选择器“.sorting > span”。“.sorting”部分将不适用于您首先选择的元素。

$('th.sorting').on('click', 'span', function() {
  alert("hello world");
});