Question

我在页面上列出了一系列HIDDEN contactID元素，并且我已经为附近的锚点分配了一个事件处理程序（单击锚点弹出联系人的配置文件）。我希望能够在创建事件处理程序时传递HIDDEN元素的值（锚点可能不在HIDDEN元素旁边，因此我不想遍历DOM）。

<input type="hidden" name="first-contact" id="first-contact" value="1" />
<.. code ..>
<a href="#" class="contact-viewer">View contact</a>

<input type="hidden" name="second-contact" id="second-contact" value="4" />
<.. code ..>
<a href="#" class="contact-viewer">View contact</a>

我目前的做法是将HIDDEN元素的ID标记放在锚点的REL属性中，并在运行我的事件时获取REL值。

<a href="#" class="contact-viewer" rel="second-contact">View contact</a>

这很好用，但感觉不对（我觉得使用REL是一种黑客行为）。有更好的方法吗？

Answer 1

理想的方法是通过将HTML元素分组在一起来指定关系（例如，包装在<div>中），然后使用父/子DOM遍历。

但是，如果无法做到这一点，那么你所采取的方法就是一个好方法。您提到的唯一问题是使用rel属性。使用HTML5，您可以使用data-属性来实现此目的：

<a href="#" class="contact-viewer" data-contact="first-contact">View contact</a>

您可以使用以下命令在事件处理程序中检索该值：

el.getAttribute('data-contact');

查看有关自定义数据属性here的更多信息。

Answer 2

这里通常的策略是为链接提供 href 属性，这样如果脚本在客户端上不可用或失败，服务器就可以完成请求。在这种情况下，所需的值可以在 href 属性中。

如果脚本可用，请从 href 获取值，取消导航并使用XHR或其他任何方式完成请求。

如果您不想将链接用作链接，请使用按钮。链接推断导航到另一个页面，按钮推断将保留在同一页面上的进程。

在创建事件处理程序时从其他元素获取值

2 个答案: