本文主要介绍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)。希望对你有帮助。如果您有任何问题，请给我留言，边肖将及时回复您。非常感谢您对我们网站的支持！

如果你觉得这篇文章对你有帮助，请转载，请注明出处，谢谢！