javascript - YUI3 - 具有相同类的链接的 Onclick 事件处理

Question

问题:YUI3 - 具有相同类的链接的 Onclick 事件处理

我们在具有相同类的页面中的链接很少。当我点击其中一个链接时，会根据点击的链接采取一些不同的操作，例如

<a href="?page=1" data="test1" class="sample">One</a>
<a href="?page=2" data="test2" class="sample">two</a>
<a href="?page=3" data="test3" class="sample">three</a>

处理程序代码:

Y.all('.sample').on('click', function(e){
    e.preventDefault();
    alert(this.getAttribute("data"));
});

当我单击任何链接时，我会得到所有“数据”属性的列表。我们只需要点击链接的数据。

Answer 1

您也可以使用 e.target 而不是 this 来访问被点击的元素:

Y.all('.sample').on('click', function(e){
  e.preventDefault();
  alert(e.target.getAttribute("data"));
});

为了获得更好的性能，您可以使用 event delegation :

Y.one('body').delegate('click', function(e){
  e.preventDefault();
  alert(this.getAttribute("data"));
}, '.sample');