Question

我有一个选择框，我想尝试获取当前所选选项的索引。我可以用这个来获得它的价值。

（＃mySelectBox）.VAL（）;

我所追求的是，如果说val被默认设置为最后一个选项，那就是option3我想获得该选项的索引。

    <div class="selectItems">
        <select id="mySelectBox">
            <option value="0">option1</option>
            <option value="1">option2</option>
            <option value="2">option3</option>
        </select>
    </div>

Answer 1

来自this blog:

// Get the text of the selected item
alert($("#myselect option:selected").text());

// Get the value of the selected item
alert($("#myselect option:selected").val());

// Get the index of the selected item
alert($("#myselect option").index($("#myselect option:selected")));

或者对于jQuery＆gt; = 1.6：

alert($('#myselect').prop('selectedIndex');

但是，当您可以获取选择的值或文本时，索引的用途是什么？如果您特别想知道它是第一个还是最后一个，也许......

alert($('#myselect option:selected').val() === $('#myselect option:first').val());
alert($('#myselect option:selected').val() === $('#myselect option:last').val());

Answer 2

我认为您正在寻找的是.selectedIndex属性。如果您在选择框中有更改事件，则可以执行以下操作：

$('select').change(function() {
   var currentIndex = this.selectedIndex;
});

这将为选项3返回2.

祝你好运。

Answer 3

$('#mySelectBox option:selected').val();

Answer 4

试试这个 - ＆gt; http://jsfiddle.net/p6Jfb/

脚本：

$("#mySelectBox").change(function() {
    console.log($(this).get(0).selectedIndex); // prints the currently selected index
})

Answer 5

$(function(){
  
    $('#mySelectBox').on('change',function(){
        console.log('Selected Value '+$('#mySelectBox option:selected').val())
        
        console.log('Selected Text '+$('#mySelectBox option:selected').text())
        
        console.log('Selected Index '+$('#mySelectBox option:selected').index())
    })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="selectItems">
        <select id="mySelectBox">
          <option value="0">select</option>
            <option value="1">option1</option>
            <option value="2">option2</option>
            <option value="3">option3</option>
        </select>
    </div>

尝试这个。

如何在所选列表中查找当前选项的索引

5 个答案: