Question

我有以下HTML：

<div class="chooser" style="display:none;"><div data-id="day">Day <i class="fa fa-arrow-right" aria-hidden="true"></i></div><div data-id="nightamst">Night A <i class="fa fa-arrow-right" aria-hidden="true"></i></div><div data-id="nightzoet">Night Z<i class="fa fa-arrow-right" aria-hidden="true"></i></div></div>
<div class="bdownload day" style="display: none;">content</div>
<div class="bdownload nightamst" style="display: none;">content</div>
<div class="bdownload nightzoet" style="display: none;">content</div>

现在有以下Javascript：

我想用前一个选择器div中的数据id显示bdownload div。

jQuery(".chooser div").click(function(){
        console.log("test");

        jQuery(".chooser").hide();
        jQuery(this).parent(".chooser").siblings(jQuery(this).attr("data-id")).toggle();
    });

但是当我使用这段代码时，它就不会被切换。当我将“.bdownload”放入兄弟选择器时，所有的bdownload都会被切换，因此故障位于attr选择器中。我是否“添加到选择器？

Answer 1

$('.chooser div').click(function() {
  var selector = '.' + $(this).data('id')
  $('.chooser').hide()
  $(this).parent().siblings(selector).toggle()
})

选择具有特定班级

1 个答案: