Question

我正在尝试将一个类分配给与其父级id匹配的跨度但是唉，它不起作用。我失败的jQuery看起来像这样：

$("span.genre").click(function(e){
    var genre_id = $(this).attr('id');
    $('span.hidden '+genre_id).addClass('sub_genre');
});

和原始html：

<div id="genres">
    <span class='genre' id='1'>Rock</span>
       <span class='hidden 1'>Alternative rock</span>
       <span class='hidden 1'>Art rock</span>
       <span class='hidden 1'>Christian rock</span>
       <span class='hidden 1'>Experimental rock</span>
    <span class='genre' id='5'>R&B/soul</span>
       <span class='hidden 5'>Contemporary R&B</span>
       <span class='hidden 5'>Disco</span>
       <span class='hidden 5'>Soul</span>
       <span class='hidden 5'>Pop R&B</span>

Answer 1

你有错误的选择器来定位span elements.use：

$("span.genre").click(function(e){
  var genre_id = $(this).attr('id');
  $('span.hidden.'+genre_id).addClass('sub_genre');
});

<强> Working Demo

Answer 2

您只是在span.hidden.错过了一段尾随句号：

$("span.genre").click(function(e){
    var genre_id = $(this).attr('id');
    $('span.hidden.'+genre_id).addClass('sub_genre');
});

<强> jsFiddle example

你有什么，正在寻找带有隐藏类的span元素，以及1或5的后代元素（不存在）。

Answer 3

只是一个小错误。你控制了两个类，所以你需要在选择器中链接它：

$('span.hidden.'+genre_id).addClass('sub_genre');

Answer 4

你也可以这样做：

$("span.genre").click(function(e){
    $(this).nextUntil('.genre').addClass('sub_genre');
});

在Jquery中向子元素添加类

4 个答案: