如何使用javascript激活HTML li [英] How to active HTML li using javascript

问题描述

我在HTML中使用此代码

I have this code in HTML

<ul class="nav nav-tabs" role="tablist">

       <li role="presentation" class="active"><a href="#unpaid" id="tabUnpaidJobs" aria-controls="unpaid" role="tab" data-toggle="tab">Unpaid Jobs</a></li>
       <li role="presentation"><a href="#available" id="tabAvailableJob" aria-controls="available" role="tab" data-toggle="tab">Available Jobs</a></li>
       <li role="presentation"><a href="#inprogress" aria-controls="inprogress" role="tab" data-toggle="tab">My In-Progress Jobs</a></li>
       <li role="presentation"><a href="#Approval" id="tabApproval" aria-controls="Approval" role="tab" data-toggle="tab">Need Approval</a></li>
       <li role="presentation"><a href="#submitted" aria-controls="submitted" role="tab" data-toggle="tab">My Submitted Jobs</a></li>
       <li role="presentation"><a href="#Resources" aria-controls="Resources" role="tab" onclick="UploadFile()" data-toggle="tab">Resources</a></li>
   </ul>

我想要默认选择第二个标签tabAvailableJob我该怎么办呢。

请帮帮我。



我试过的：



我试过这段代码

$（'＃example'）。addClass（active）;

Here i want to select second tab "tabAvailableJob" by default how can i do this.
Please help me.

What I have tried:

I have tried this code
$('#example').addClass("active");

推荐答案

（'＃example'）。addClass（active）;

('#example').addClass("active");

假设你正在使用Bootstrap [ ^ ]，这样的事情应该有效：

Assuming you're using Bootstrap[^], something like this should work:

（ ＃tabAvailableJob）。tab（ show）;

("#tabAvailableJob").tab("show");

或者，从第一个< li>中删除有效类和 tab-pane ，并将其添加到第二个：

Alternatively, remove the "active" class from the first <li> and tab-pane, and add it to the second:

<ul class="nav nav-tabs" role="tablist">
    <li role="presentation">...</li>
    <li role="presentation" class="active"><a href="#available" id="tabAvailableJob" aria-controls="available" role="tab" data-toggle="tab">Available Jobs</a></li>
    ...
</ul>
<div class="tab-content">
    <div role="tabpanel" class="tab-pane" id="unpaid">...</div>
    <div role="tabpanel" class="tab-pane active" id="available">...</div>
    ...
</div>

（如果你正在使用别的东西，那么你需要告诉我们它是什么。）

这篇关于如何使用javascript激活HTML li的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！