Question

我很难突出显示子类别中的标签。第一段代码是一个单一的选项卡，其中 class ='active_pat_tab'作为突出显示选项卡的标识符。该类通过一个变量动态添加，该变量标识了包含 li 的 id ，在这种情况下 id ='tabAssessDetails'。

<li class='tabs_item' id='tabAssessDetails'>
    <a href='#page-1' class='active_pat_tab'>
        <span>Assess Details</span>
    </a>
</li>

但是，在下面的示例中，我有一个包含两个子类别的选项卡。它仍然由传入变量标识，但在这种情况下，标识的项目是需要突出显示的选项卡的子类别。 id ='tabPhysicalExamination'是指所请求的标签，但动态类添加应该转到父li的a ...请参阅第3个示例代码。

<li class='has-sub tabs_item'>
    <a href='#page-2'><span>Observation</span></a>
    <ul>
        <li class='tabsub' id='tabCareLevel'>
            <a href='#page-17'><span>Care Level</span></a>
        </li>
        <li class='tabsub' id='tabPhysicalExamination'>
            <a href='#page-3'><span>Physical examination</span></a>
        </li>
    </ul>
</li>

应该是什么样的：

<li class='has-sub tabs_item'>
    <a href='#page-2' class='active_pat_tab'><span>Observation</span></a>
</li>

我尝试过一些事情，包括

$( "li.tabsub" ).closest( "a" ).addClass('active_pat_tab');

和

$( "li.tabsub" ).parents( "li.tabs_item" ).addClass('active_pat_tab');

但我未能将课程添加到正确的位置。

PS：标签上没有任何点击。这是从特定选项卡的不同页面。我不认为我可以在这个例子中使用click。或者我错过了什么？

Answer 1

从您的起始元素中，您希望获得包含<ul>，然后是<a>元素，以便：

$('#' + id).closest('ul').prev('a').addClass('active_pat_tab');

我使用过'#' + id，因为你说你有一个变量来识别起始元素的ID，并且从一个看起来像是id的问题。

Answer 2

使用

$( "li.tabsub" ).closest("li.tabs_item").children("a").addClass('active_pat_tab');

参考文献

.children()

.closest()

Answer 3

你为什么不这样做：

$('#page2').addClass('active_pat_tab');

现在它没有这样做，因为你的＃page2锚是带有ul的兄弟姐妹，所以你不能用.closest（）选择它。

此外，$( "li.tabsub" ).parents( "li.tabs_item" ).addClass('active_pat_tab');无效，因为该类不是您的主要元素。

您可以在不使用ID的情况下执行此操作：

$( "li.tabsub" ).closest( "li.tabs_item" ).find('a:first').addClass('active_pat_tab');

JQuery遍历添加一个类

3 个答案: