Question

我有一个带有数据属性的元素列表，如下所示：

<div class="first-div" data-month="march"></div>
<div class="first-div" data-month="june"></div>

现在我想获取所有data-month属性并为其添加一个点击监听器。代码现在看起来像这样：

$('[data-month]').forEach(function(month) {
    $('[data-month="' + month + '"]').bind('click', function() {
        // Do something
    });
});

然而，这不起作用。似乎无法使用month元素。有谁知道如何让它发挥作用？

^{它是否适用于所有浏览器？}

Answer 1

您的month变量将成为jquery对象。您需要提取月份的字符串值。

但据我所知，这似乎并非必要。您可以直接将事件侦听器分配给each

中的对象

尝试做：

$('[data-month]').each(function(i, monthEl) {
    $(monthEl).bind('click', function() {
        // If you need to get the month value, you can use jQuery's .data()
        var monthString = $(monthEl).data('month');
    });
});

Answer 2

您应该将.forEach更改为.each，而月份参数将是div元素，而不是字符串。

$('[data-month]').each(function(month) {
    $('[data-month="' + month.getAttribute('data-month') + '"]').bind('click', function() {
        alert(month);
    });
});

如何获取页面上特定数据属性的所有值并使用收集的值

2 个答案: