Question

从下面查找current类，无论哪个数据属性选项卡具有类，并将current类添加到div下面带有tab-content的类似ID

<a class="projects_select tab-link" data-tab="tab-1" href="#tab1"> tab1 </a>
<a class="projects_select tab-link current" data-tab="tab-2" href="#tab2"> tab2 </a>
<a class="projects_select tab-link" data-tab="tab-3" href="#maps"> tab3 </a>

我有以下div's拥有tab-content类。

<div class="tab-content" id="tab-1">Tab-1 </div>
<div class="tab-content" id="tab-2">Tab-2 </div>
<div class="tab-content" id="tab-3">Tab-3 </div>

尝试：

$(document).ready(function($) { 
    $('.projects_select').find('current').attr(data-tab);
    $('.tab-content').addClass('current');
});

Answer 1

基本答案只是一个组合的类选择器，您需要将其分配给变量：

var myId = $('.projects_select.current').attr(data-tab);

然后，使用该元素选择一个随播元素：

$('#' + myId).addClass('current');

但是，我建议简化使用顺序（索引）：

var myIndex = $('.projects_select.current').index();

然后...

$('.tab-content').eq(myIndex).addClass('current');

这消除了对ID和数据属性的要求。如果页面上有.tab-content的更多实例，请从包含这两组元素的元素中添加一个类：

$('.parent-element .tab-content').eq(myIndex).addClass('current');

https://api.jquery.com/eq/

如何选择具有特定类别的元素？

1 个答案: