Question

<select id="sel">
<option value="123" selected="selected">text1</option>
<option value="44">text2</option>
<option value="882">text3</option>
...
</select>

如何使用jQuery获取所选选项的索引？可能是.index(subject)，但是所有测试的可能性都不起作用......

P.S。索引：value =“123”=＆gt; 0，value =“44”=＆gt; 1，......

感谢名单

Answer 1

只有鲍勃的第二个答案是正确的：

$("#sel")[0].selectedIndex

使用： http://jsfiddle.net/b9chris/wxeVN/1/

仅当用户（或浏览器的DOM还原）未更改自页面加载后选择的选项时，才使用.attr()： http://jsfiddle.net/b9chris/wxeVN/

您可以将其实现为jQuery扩展，并在此过程中获取更多信息：

(function($) {
    $.fn.selectedOption = function() {
        var sel = this[0];
        return sel.options[sel.selectedIndex];
    };
})(jQuery)

$('button').click(function() {
    $('#output').text('selected index: ' + $('select').selectedOption().index);
});

http://jsfiddle.net/b9chris/wxeVN/102/

.selectedOption()返回的内容是实际的选项标记，因此您可以访问.index，.value和.text - 比典型的索引更方便一点的使用。

Answer 2

在我写这篇文章时，尽管近五年前被指出，但其中两个最佳答案（包括已接受的答案）是不正确的。 attr("selectedIndex")不执行任何操作，因为selectedIndex是实际DOM元素的属性，而不是HTML属性。您需要使用prop：

$(this).prop('selectedIndex')

交互式演示将此与不正确的版本进行比较：http://jsfiddle.net/uvwkD/

Answer 3

$("#sel").attr("selectedIndex")

或

$("#sel")[0] //to get the DOM element
$("#sel")[0].selectedIndex

Answer 4

这样做：

   $("#sel").attr("selectedIndex")

Answer 5

你可以在没有jQuery的情况下实现它：的 var sel = document.getElementById( 'sel' ); var index = sel.selectedIndex;

Answer 6

在这种情况下，你可以通过检查所选元素之前有多少兄弟元素来获取元素的索引：

$('#sel option:selected').prevAll().length;

Answer 7

使用jquery的标准索引函数，如此代码示例

$("#sel option:selected").index()

Answer 8

标题与问题不相符......

如何获取select-＆gt;选项标记的索引

option.index // javascript

$(option).prop('index') // jquery

选定选择 - ＆gt;选项标记的索引：

document.getElementById('sel').selectedIndex // javascript

如何获取select-＆gt;选项标记的索引

8 个答案: