Javascript 选择元素时找不到数据id 提前道歉，我觉得这是一个非常简单的解决办法，我正处于一个严重的脑部放屁的中间。我只是尝试使用ES6语法获取我正在单击的项目的数据id，但无论我以何种方式运行它，我总是无法定义

HTML

<ul>
    <li class="list-item" data-id="item-1">Click me</li>
    <li class="list-item" data-id="item-2">Click me</li>
    <li class="list-item" data-id="item-3">Click me</li>
</ul>

---

我尽可能简化了代码，有人知道我做错了什么吗？

问题出在您的

attachHandlers

方法中。由于您使用的是箭头函数，

此

引用的是类，而不是单击的元素

---

将箭头函数更改为常规函数

问题出在您的

attachHandlers

方法中。由于您使用的是箭头函数，

此

引用的是类，而不是单击的元素

---

将箭头函数更改为常规函数

除了Josan的答案之外，如果您想继续使用arrow函数，请如下使用：

class List {
    constructor($el) {
        this.$el = $el;
        this.attachHandlers();
    }

    attachHandlers() {
        this.$el.on('click', 'li', (e) => {
            var data = $(e.currentTarget).attr('data-id');
            console.log(data);
        });
    }
}

---

有关更多讨论，请参阅。

除了Josan的答案之外，如果要继续使用箭头功能，请如下使用：

class List {
    constructor($el) {
        this.$el = $el;
        this.attachHandlers();
    }

    attachHandlers() {
        this.$el.on('click', 'li', (e) => {
            var data = $(e.currentTarget).attr('data-id');
            console.log(data);
        });
    }
}

---

有关更多讨论，请参阅。

使用JQuery更简单、更容易：

$（“.list项”）。在（'click'，function（）上{
console.log（$（this.data（'id'））；
})

单击我
单击我
单击我

只需使用JQuery即可简化：

$（“.list项”）。在（'click'，function（）上{
console.log（$（this.data（'id'））；
})

单击我
单击我
单击我

这似乎返回列表中第一个元素的数据id内容，而不是已单击的元素的数据id内容。如果我通过console.log e.currentTarget传递事件，我可以看到正确的元素，但它总是返回第一个元素的数据idelement@user934902是的，因为您的构造函数总是将第一个

li

设置为

this.$listItem

。然后我对您的答案感到困惑，您刚才描述的使用箭头函数如何解决我的问题issue@user934902--请看我的最新答案。这应该可以解决问题。您不需要使用

$listItem

。这似乎返回列表中第一个元素的数据id内容，而不是已单击的元素的数据id内容。如果我通过console.log e.currentTarget传递事件，我可以看到正确的元素，但它总是返回第一个元素的数据idelement@user934902是的，因为您的构造函数总是将第一个

li

设置为

this.$listItem

。然后我对您的答案感到困惑，您刚才描述的使用箭头函数如何解决我的问题issue@user934902--请看我的最新答案。这应该可以解决问题。你不需要使用

$listItem

。他在使用jQuery他在使用jQuery