弃用 jQuery 伪选择器和 on() 事件处理程序

Question

现在，我已经看到，从 jQuery 3.4 开始，一些伪选择器已被弃用，例如 :last 选择器。目前，我正在使用这些选择器来附加事件处理程序，例如：

$('#my-table').on('click', '.btn:last', function (e) {
    // ...
});

我需要这种事件处理方式，因为我在运行时动态添加行，不想为添加的每一行添加单独的事件处理程序。

文档指出，我现在应该使用 last() 而不是 :last。但是如何在上面的 on() 处理程序中使用它？

Answer 1

最简单的方法是在按钮上添加一个 class。

HTML:
<table id="my-table> 
  [...] 
  <button class="btn-last">Click</button> 
  [...] 
</table>

JS:
$('#my-table').on('click', '.btn-last', function (e) {
    // ...
});

根据您的 HTML，您还可以使用 last-child（可能类似于 td:last-child .btn

$('#my-table').on('click', '.btn:last-child', function (e) {
    // ...
});

弃用 jQuery 伪选择器和 on() 事件处理程序

Deprecated jQuery pseudo selectors and on() event handler

jquery

events