选择 selectedIndex jQuery - JavaScript

在前端开发过程中，我们经常需要通过代码来选定一个下拉框（<select>）的选项。其中，selectedIndex 参数是非常常用的，它可以指定选中哪一个选项。在 jQuery 和 JavaScript 中，我们都可以通过操作 selectedIndex 来实现对下拉框选中项的操作。本文将介绍如何在 jQuery 和 JavaScript 中操作 selectedIndex。

jQuery 中的 selectedIndex

在 jQuery 中，我们可以通过 .val() 方法获取或设置选中的选项的值，同时也可以通过 .prop() 方法来获取或设置选中项的索引的值。下面是一个示例，选中某一个下拉框的第二个选项。

$( "#mySelectBox" ).prop( "selectedIndex", 1 );

上面的代码中，我们通过 prop() 方法获取了 selectedIndex 属性，并将其值设置为了 1，这将会让下拉框选中其第二个选项。我们还可以用以下代码来获取当前选中的选项的索引：

$( "#mySelectBox option:selected" ).index();

上述代码使用了 jQuery 的 :selected 伪类来获取选中的选项，并使用 .index() 方法获取其索引，注意：索引从 0 开始。

JavaScript 中的 selectedIndex

在 JavaScript 中，我们可以通过以下代码来获取或设置选中项的索引：

var selectBox = document.getElementById("mySelectBox");
selectBox.selectedIndex = 1; //设置选中第二个选项

同样，我们也可以使用 selectedIndex 属性来获取当前选中的选项的索引值：

var selectBox = document.getElementById("mySelectBox");
var selectedOption = selectBox.options[selectBox.selectedIndex];

上述代码中，我们首先获取了下拉框元素，然后通过 options[] 数组来获取选项，并通过 selectedIndex 来获取其索引值。如果想获取当前选中的选项，我们只需要将上述代码拓展一下，获取 options[] 数组中相应的选项即可。

除了使用 selectedIndex 属性以外，我们还可以使用 value 属性来获取或设置选中的选项的值。

结尾

至此，本文介绍了如何在 jQuery 和 JavaScript 中使用 selectedIndex 来操作下拉框的选中项。同时，我们也了解了如何使用 value 属性来获取或设置选中的选项的值。希望本文能对您实际工作或学习上有所帮助。