本文主要介绍JS检索下拉列表框中选中项的索引号(selectedIndex)。本文以示例代码的详细说明的形式向您详细介绍了它。有需要的朋友可以参考一下。
前言
在开始本文的主题之前,我们先来看一个HTML演示,一个非常简单的选择列表:
挑选
选项一/选项
选项二/选项
选项三/选项
/选择
请思考一个问题。如果这些数据(一个/两个/三个)是从后台请求并动态添加渲染到DOM系统中的,那么你无法确定每个列表项的索引号,也就是说这些列表项没有ID。显然,我们需要获得用户选择的列表项和当前列表项的索引号(ID)。
selectedIndex API
JavaScript提供了一种方法来查找select ID的索引号,它反映了第一个或最后一个选定的索引选项元素,具体取决于值的倍数。请注意,值-1表示没有选择任何元素。
SelectedIndex属性可以设置或返回下拉列表中所选选项的索引号。如果允许多选,则只返回第一个所选选项的索引号。
语法:
//获取索引号
selectElem.selectedIndex
//重置索引号(newIndex是新值)
selectelem . selectedindex=new index
获取索引 / 重置索引
我们可以使用JavaScript提供的API来获取当前用户选择列表项的索引号。当然,我们也可以重置(更改)索引号。
HTML:
选择id='select '
选项一/选项
选项二/选项
选项三/选项
/选择
按钮onclick='get()'获取索引号/按钮
按钮onclick='reset()'重置索引号/按钮
JavaScript:
//获取列表项(选择)
var select=document . getelementbyid(' select ')
//获取索引号
函数get(){
Console.log(`当前索引号:$ {select.selectedindex } `)
}
//重置索引号
功能重置(){
flag=select.selectedindex//Use封装频繁(* _ *)
If(flag=='0'){ //重置索引值为0的列表项
Flag=999 //将该值更改为999
Console.log(`重置后的索引号:$ {flag } `)
Console.log(`注意:重置不会改变原始值。不信你看看现在的值:$ {select.selectedindex } `)
}
}
总结
以上是边肖介绍的JS搜索下拉列表框中选中项的索引号(selectedIndex)。希望对你有帮助。如果您有任何问题,请给我留言,边肖将及时回复您。非常感谢您对我们网站的支持!
如果你觉得这篇文章对你有帮助,请转载,请注明出处,谢谢!
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。