如何获取<;的选定索引;李>;内部<;ul>;使用Javascript?
我曾经为所选的如何获取<;的选定索引;李>;内部<;ul>;使用Javascript?,javascript,html-lists,selectedindex,Javascript,Html Lists,Selectedindex,我曾经为所选的执行此操作: var select_filter = document.getElementById("myDropdown"); if (select_filter && select_filter[select_filter.selectedIndex].value == 0) { ///... } 但是现在我在中使用元素,那么我如何才能实现上述相同的功能呢 编辑 添加了html: <ul class="nav nav-t
执行此操作:
var select_filter = document.getElementById("myDropdown");
if (select_filter && select_filter[select_filter.selectedIndex].value == 0) {
///...
}
但是现在我在
中使用
元素,那么我如何才能实现上述相同的功能呢
编辑
添加了html:
<ul class="nav nav-tabs" id="nav-tabs">
<li class="nav-item" id="Driftcenter-nav-tav">
<a class="nav-link active" data-toggle="tab" href="#Driftcenter"
onclick="load_business_units(); showFilter();">Driftcenter</a>
</li>
<li class="nav-item" id="vognmaend-nav-tav">
<a class="nav-link" data-toggle="tab" href="#vognmaend"
onclick="load_operation_carrier_list(); showFilter();">Vognmænd</a>
</li>
<li class="nav-item" id="ads-segment-nav-tav">
<a class="nav-link" data-toggle="tab" href="#ads-segment"
onclick="load_ads_units(); showFilter();">ADS Segment</a>
</li>
<li class="nav-item" id="traffik-info-nav-tab">
<a class="nav-link" data-toggle="tab" href="#trafik-info"
onclick="filterTrafficCondition(); hideFilter();">Trafikinfo</a>
</li>
<li class="nav-item" id="vejr-varsel-nav-tab">
<a class="nav-link" data-toggle="tab" href="#vejr-varsel"
onclick="filterTrafficWeather(); hideFilter();">Vejrvarsel</a>
</li>
</ul>
-
-
-
-
-
您可以执行类似下面的示例的操作来获取单击列表项的索引
const ulList=document.getElementById(“ul ele”);
const li=document.getElementsByTagName('li');
var nodes=Array.from(ulList.children);
设selected=-1;
document.getElementById(“ul ele”).addEventListener(“单击”,函数(e){
if(已选择!==节点索引of(e.target)){
所选=节点。indexOf(e.target);
console.log(选中);
}否则{
console.log(“已选择”);
}
});代码>
- 指标1
- 指标2
- 指标3
- 指标4
无序列表中没有选定的索引。如果您自己选择一个,您可能正在向其中添加一个类以将其标记为选中,但由于您尚未显示该部分的代码,因此此问题对于SOifdocument.querySelectorAll('.selected')。length>0
,则选择了一个或多个项目。我整理了一段代码片段以查看一些潜在用途:。。。或者,如果您想更具体一点,if(document.querySelectorAll(#myDropdown>li.selected).length>0{/*当至少选择了一项时做您想做的事*/}
根据您的代码,您没有任何值;这是一个链接列表。如果您的意思是要检查是否只选择了一个项目,而不是检查If(document.querySelectorAll('.selected').length>0){…}
您要检查If(document.querySelectorAll('.selected').length==1){…}
您说的“我想检查是否选择了那个项目”是什么意思?我假设当用户点击链接时设置了active
类,因此如果它有active
类,则选中该类;你为什么要检查?另一方面,我建议采用一种稍微不同的方法来分离关注点;类似这样:但是我怎么能在不添加任何事件优先级的情况下检查是否有任何选择?创建一个变量名selected
,并在selected
时更新其值。它不应与已选择的值相同我不尝试更改其所选值,我只是想了解是否有任何选择,然后您可以为所选元素在li上添加一个类selected
,并循环节点
,以检查所选类存在于哪个li中。很抱歉再次询问,但您可以查看编辑的问题吗?我已经添加了html,现在每个都包含一个元素。