如何查找給定文本的下拉列表的索引

Question

如何使用jQuery查找給定值的下拉列表的索引？

這裏是我的下拉有三個值：

1. 管理
2. mananger
3. 員工

我能夠獲得所選擇的值的索引像下面

var index = $("#mydropdown").find("option:selected").val(); 

但我需要t Ø通過傳遞經理作爲參數傳遞給一個jQuery函數來獲取指數

我試過這樣知道經理的指標，但它不工作

var index = $("#mydropdown").find("manager").val(); 

Answer 1

您可以使用:contains或.filter()。我個人比較喜歡.filter()：

var index = $("#mydropdown").find(":contains(manager)").val(); 
//Or 
var index = $("#mydropdown").filter(function(){ 
    return $.trim($(this).text()) === "manager"; 
}).val(); 

此假設你的下拉是這樣的：

<select> 
    <option value="1">admin</option> 
    <option value="2">manager</option> 
    <option value="3">employee</option> 
</select> 

Answer 2

我想你需要的東西是這樣的：

JS

$("select option[value='manager']").index() 

HTML

<select> 
    <option value="admin">admin</option> 
    <option value="manager">mananger</option> 
    <option value="employee">employee</option> 
</select> 

fiddle

Answer 3

注意：如果需要強制用戶進行選擇使用一個空的選項，然後有一些代碼檢查對於值='0'或索引分別爲零。 爲了這個目的，我在下面的兩個實現中都添加了一個空選項。

執行＃1：

function optionchanged() 
{ 
    var i = $("#option1").val(); 
    var t = $("#option1 option:selected").text(); 
    console.log("The Index of option selected is: " + i); 
    console.log("The Text of option selected is: " + t); 
} 

分配指數各選項設置爲值屬性，可以更好地控制返回的值。

<select id="option1" onchange="optionchanged();"> 
    <option value="0"></option> 
    <option value="1">Admin</option> 
    <option value="2">Manager</option> 
    <option value="3">Employee</option> 
</select> 

控制檯輸出看起來是這樣的：

選擇 '管理' 產生：
選項的選擇的指標是：1
選項的選擇的文本是：管理員

選擇'員工'生產：
選擇的選項索引爲：3
選擇的選項文本爲：員工

執行＃2：

如果你不希望添加索引值，可以參考指數直接在jQuery的是這樣的：

function optionchanged() 
{ 
    //var i = $("#option1 ").val(); 
    var i = $("#option1 option:selected").index(); 
    var t = $("#option1 option:selected").text(); 
    console.log("The Index of option selected is: " + i); 
    console.log("The Text of option selected is: " + t); 
    //alert("Value of option 1 is: " + index); 
} 


<select id="option1" onchange="optionchanged();"> 
    <option></option> 
    <option>Admin</option> 
    <option>Manager</option> 
    <option>Employee</option> 
</select> 

控制檯輸出會看的同上。