Question

我想创建一个div，或者更确切地说，一个“旁边”元素，当点击具有相同类的另一个元素时，它会出现一个id或类...我知道有标准类选择器，但我希望有不止一个“旁”元素与不同的id或类，我希望打开一个与被点击的元素具有相同的类或ID ...

所以，我不想为每一个div编写这段代码：

    $(window).load(function(){
      $('nav ul li#someid').click(function () {
      $('aside#someid').toggleClass('opened');
      });
    });

我想要这样的代码。有没有办法将示例中的someid更改为检测被点击元素具有的id并将其用作“旁边”选择器的内容？

Answer 1

首先，您可能想知道可以使用this来访问被点击的对象。这意味着您可以获取this.id或this.className来获取所点击对象的ID或类。现在，您对该信息的确切处理取决于HTML的结构，因此我们需要看到它以提供更多细节。

您不能在具有相同ID的同一页面中拥有多个对象。您根本无法做到这一点（当您这样做时，选择器将无法正常工作）因此您所需的方案将无法正常工作。您可以改为使用类，并使用相同的类切换其他项。这适用于一个特定的li。

$(document).ready(function(){
    $('nav ul li.foo').click(function () {
        $('aside.foo').toggleClass('opened');
    });
 });

或者，根据你的HTML（如果li标签上只有一个类），你可以做一个更通用的版本：

$(document).ready(function(){
    $('nav ul li').click(function () {
        $('aside.' + this.className).toggleClass('opened');
    });
});

如果您向我们展示您的实际HTML，我们可以提供最佳选择。

Answer 2

您可以尝试使用：

this.id

此指向捕获该事件的元素。

Answer 3

您检查了jQuery starts with selector吗？

的jQuery（ '[属性^ = “值”]'）

$('aside[id^="foo_"]').toggleClass('opened');

这将为aside属性以id开头的所有foo_代码调用toggleClass

正如其他人所提到的，你不能有超过1个相同的id标记，但是你可以使用foo_启动所有标记并使用带有selector的开头来定位它们.... foo_1 { {1}} foo_2等...

Answer 4

尝试

  $(function(){
      $('nav ul li.someClass').click(function () {
      $('aside#aside_' + $(this).attr('id')).toggleClass('opened');
      });
    });

jQuery用简单的代码选择所有同一个类？

4 个答案: