獲取元素的ID

Question

我想獲取活動標簽的ID。 我的代碼無法正常工作。 救命

 //if it's the second tab, refresh it var liID = $('#menu').hasClass('active').attr(id); console.log(liID); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul class="nav nav-tabs" role="tablist" id="menu"> <li role="presentation" class="active"> <a href="#container" data-toggle="tab" aria-controls="step1" role="tab" title="Container"> <span class="round-tab"> <i class="fa fa-archive"></i> </span> </a> </li> <li role="presentation" class="disabled"> <a href="#parameters" data-toggle="tab" aria-controls="step2" role="tab" title="Parameters"> <span class="round-tab"> <i class="glyphicon glyphicon-pencil"></i> </span> </a> </li> <li role="presentation" class="disabled"> <a href="#results" data-toggle="tab" aria-controls="step3" role="tab" title="Results"> <span class="round-tab"> <i class="glyphicon glyphicon-ok"></i> </span> </a> </li> </ul> 

Answer 1

您沒有選擇活動的li，並且缺少引號。 您正在嘗試查看“菜單”元素是否處於活動狀態，並讀取其值。

$('#menu').find('.active').attr('id')

要么

$('#menu .active').attr('id')

Answer 2

id必須用引號引起來，否則它被認為是一個變量，您沒有聲明。

接下來，您嘗試獲取ID是不正確的，因為.hasClass()返回一個布爾值，而不是具有該類的元素，因此，在返回值上調用.attr()將會失敗。

最后，您的active元素甚至都沒有id 。

這是一個更正的版本：

 //if it's the second tab, refresh it if($('#menu li').hasClass('active')){ var liID = $('#menu li.active').attr("id"); console.log(liID); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul class="nav nav-tabs" role="tablist" id="menu"> <li role="presentation" class="active" id="HELLO"> <a href="#container" data-toggle="tab" aria-controls="step1" role="tab" title="Container"> <span class="round-tab"><i class="fa fa-archive"></i></span> </a> </li> <li role="presentation" class="disabled"> <a href="#parameters" data-toggle="tab" aria-controls="step2" role="tab" title="Parameters"> <span class="round-tab"><i class="glyphicon glyphicon-pencil"></i></span> </a> </li> <li role="presentation" class="disabled"> <a href="#results" data-toggle="tab" aria-controls="step3" role="tab" title="Results"> <span class="round-tab"><i class="glyphicon glyphicon-ok"></i></span> </a> </li> </ul> 

但實際上，這應該更簡單：

 // Just query for the active element and then use it: console.log($('#menu li.active').attr("id")); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul class="nav nav-tabs" role="tablist" id="menu"> <li role="presentation" class="active" id="HELLO"> <a href="#container" data-toggle="tab" aria-controls="step1" role="tab" title="Container"> <span class="round-tab"><i class="fa fa-archive"></i></span> </a> </li> <li role="presentation" class="disabled"> <a href="#parameters" data-toggle="tab" aria-controls="step2" role="tab" title="Parameters"> <span class="round-tab"><i class="glyphicon glyphicon-pencil"></i></span> </a> </li> <li role="presentation" class="disabled"> <a href="#results" data-toggle="tab" aria-controls="step3" role="tab" title="Results"> <span class="round-tab"><i class="glyphicon glyphicon-ok"></i></span> </a> </li> </ul> 

Answer 3

用ID包裹ID。 hasClass返回一個布爾值。 所以

var liID = $('#menu li.active').attr('id');

會將liID設置為具有父“菜單”和活動類（如果有）的li元素的id。