javascript - 如何将 span 元素的 HTML 设置为自定义数据属性的内容？

Question

我想显示表中的行数。我已经用 PHP 计算了这个并输出了 <span>200 rows total</span> ，但我想使用 Javascript 将其切换为 <span>Showing 2 of 200 total rows</span>如果 table 折叠起来。理想情况下，我想要这样的东西:

$(".collapse-count").html('Showing 2 of ' + $(this).data("count") + ' total rows');

带有标记:

<span class="collapse-count" data-count="200">Showing 2 of 200 total rows</span>

但这不起作用。我怎样才能使用 jQuery 做到这一点？

Answer 1

您需要在正确的上下文中使用this。

$(".collapse-count").html(function() {
    return 'Showing 2 of ' + $(this).data("count") + ' total rows');
});

<小时/>

当您将回调传递给.html()时，匹配的元素将被迭代，并且this将是对迭代中当前元素的引用。

按照您的方式，您正在使用 this 的封闭值。