Jquery：具有单个选择器的多个内容？

Question

我正在使用一个模式系统，它在点击时显示内容，我将在集成在CMS中的项目中使用它，但我想知道是否可以使用相同结构，相同ID和类别的项目下方。

<div id="test">
    <a class="link" href="#">Link 1</a>
    <div id="basic-modal-content">
        Description 1
    </div>
</div>

<div id="test">
    <a class="link" href="#">Link 2</a>
    <div id="basic-modal-content">
        Description 2
    </div>
</div>  

我尝试了以下jquery代码，但它只适用于第一个：

    $('#test').click(function (e) {
    $(this).find('#basic-modal-content').modal();

    return false;
});

我认为可以有一些技巧或其他东西，而不需要动态地参与每个模态的id / class。如果有一个选择器可以帮助我，请告诉我。

感谢您阅读我的问题。

Answer 1

不要使用ID，除非它是一个独特的元素。请改用类。如果您使用ID选择某些内容，则返回的jQuery对象将仅引用它找到的第一个，因此ID应仅用于唯一项目。

让我更好地改写一下。 ID应该是唯一的。可以在不唯一的元素上使用ID，但不应在页面上的任何其他位置使用相同的ID。