javascript - 多个锚链接引用可在 JavaScript 中使用的单个值的最佳方式

Question

我在页面上有任意数量的锚链接，需要在点击时执行相同的 JavaScript 代码块，并且该代码需要与一个值相关联。每页都有几个。我通常使用隐藏输入以一对一的关系存储值，但是将放置在整个页面中的多个链接与值相关联的最佳方法是什么？

例如，考虑一组按 ID 引用产品的链接，并且都显示该产品的相同动态层。现在可能有一组产品的多组链接。我如何绘制这些关联？我正在使用 Mootools 并按类绑定事件，所以我不想要一堆传递参数的内联事件函数调用。

Answer 1

如果您已经在使用 Mootools，一个很好的方法是使用元素的数据存储。

window.addEvent('domready', function() {
  $$('a.classname').each(function(el) {
    el.store('productID', /*get this however you want*/);

    el.addEvent('click', function(e) {
      var productID = el.retrieve('productID');
    }
  }
}

这是获取 productID 的一种方法（假设您可以控制 URL 格式）：

<a href='ViewProduct.php?ProductID=7#pid:7'>link</a>

//in your js (above)
var pid = el.get('href').split('#')[1].split(':')[1];
el.store('productID', pid);

Answer 2

你想在你的 html 代码中设置值吗？否则，您可以将值动态添加到 dom 节点本身。

如果您想在 html 中设置它们，如果您不关心标准合规性，请使用自定义属性。如果您确实关心，请将值编码为类名或使用lang-attribute 并在您的数据前加上“x-”，以便您保持符合 RFC 1766。