通过单击另一个ul li元素来获取活动的ul li元素id

时间:2016-06-10 15:18:13

标签: javascript jquery

我有两个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);
});

0 个答案:

没有答案