Javascript 如何将元素与jQuery的触发器链接相关联？

我不确定如何正确地命名我的问题，但问题是：

我在一个页面上有许多div元素，并触发指向这些元素的链接，每个元素都有锚ID。这些元素将用作弹出窗口

<a href="#pop1" class="trigger" id="t1">Show Popup #1</a>
<a href="#pop2" class="trigger" id="t2">Show Popup #2</a>
<a href="#pop3" class="trigger" id="t3">Show Popup #3</a>

<div id="pop1" class="popup">...content here...</div>
<div id="pop2" class="popup">...content here...</div>
<div id="pop3" class="popup">...content here...</div>

---

由于触发器有一个公共类

触发器

，因此可以执行以下操作：

$(".trigger").click(function(){
    $(this.href).toggle(); // href is "#pop1", "#pop2", etc.
    return false; // prevent default action of anchor tag click
});

---

您可以将数据属性（例如，数据div id）添加到包含关联div id的链接标记中：

<a href="#pop1" class="trigger" id="t1" data-div-id="pop1">Show Popup #1</a>

---

应该使用

preventDefault（）

而不是

return false

-@techfoobar，这可能是一个好的、简单的解决方案，但它不起作用$（this.href）在您的代码中返回空数组。谢谢，这个可以正常工作，但必须有一个基于href属性的解决方案。

<a href="#pop1" class="trigger" id="t1" data-div-id="pop1">Show Popup #1</a>

$('a.trigger').click(function(){
    $('div#' + $(this).data('divId')).toggle();
}