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

all为您提供匹配元素的列表。您可以使用它each来迭代列表并为单个节点执行操作。有关更多信息，请参阅他们的节点类 API 。

\n\n

这是代码，以及jsfiddle 上的示例。

\n\n

Y.all(\'.sample\').each(function(node) {\n    node.on(\'click\', function(e) {\n        e.preventDefault();\n        alert(node.getAttribute("data"));\n    });\n});\xe2\x80\x8b\n

\n\n

yuilibrary.com 上的事件用户指南 (http://yuilibrary.com/yui/docs/event/#nodelist-this) 上还有一个针对此问题的常见问题解答条目。通常最好使用事件委托。

\n