我有两个ul
元素。点击其中一个我想获得活跃的li
元素的类。现在,通过单击任何li
元素,我只获得一个活动的ul
元素类。
<div class="container secondary-header-tab-container">
<ul class="nav nav-tabs header-tabs dashboard-tabs" id="tab-shift" role="tablist">
<li role="presentation" class="active">
<a href="#" aria-controls="active" role="tab" data-toggle="tab" class="filter active" data-filter=".filterActive" id="active">Active</a>
<p class="active_jobs_count" data-count="">0</p>
</li>
<li role="presentation" class="">
<a href="#" aria-controls="archived" role="tab" data-toggle="tab" class="filter" data-filter=".filterArchived" id="inactive">Inactive</a>
<p class="active_jobs_count" data-count="">0</p>
</li>
<li role="presentation" class="">
<a href="#" aria-controls="completed" role="tab" data-toggle="tab" class="filter" data-filter=".filterCompleted" id="closed">Closed</a>
<p class="active_jobs_count" data-count="">0</p>
</li>
</ul>
<div class="job-card-sort-container pull-right" title="Filter">
<div class="btn-group">
<button type="button" class="btn btn-default dropdown-toggle active-sort" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">All</button>
<div type="button" class="btn btn-default sort-dropdown-icon">
<span class="glyphicon glyphicon-filter"></span>
<span class="sr-only">Toggle Dropdown</span>
</div>
<ul class="dropdown-menu">
<li><a href="#" class="filter active" data-filter="all">All</a></li>
<li><a href="#" class="filter" data-filter=".normal" >Normal</a></li>
<li><a href="#" class="filter" data-filter=".urgent" >Urgent</a></li>
<li><a href="#" class="filter" data-filter=".private">Private</a></li>
<li><a href="#" class="filter" data-filter=".shared" >Shared</a></li>
</ul>
</div>
</div>
</div>
$(document).on('click', '.dashboard-tabs li, .job-card-sort-container ul li', function() {
var dataFilter = $('.secondary-header-tab-container').find('.dashboard-tabs li .active').text();
alert(dataFilter);
var job_type = $('.secondary-header-tab-container').find('.job-card-sort-container ul li .active').text();
alert(job_type);
});