使用jQuery獲取下拉菜單項的選定值

355

如何使用jQuery獲取下拉菜單框的選定值？
我嘗試使用使用jQuery獲取下拉菜單項的選定值

var value = $('#dropDownId').val();

和

var value = $('select#dropDownId option:selected').val();

但都返回一個空字符串。

來源

2010-05-06 shyam

這些都應該工作。問題必須在其他地方（例如，代碼包裝在'$（document）.ready（...'block？） – karim79 2010-05-06 11:12:20

'var value = $（'＃dropDownId：selected'）。val（）;' – ant 2010-05-06 11:12:30

''（'＃dropDownId'）。val（）;'是獲取選定值的最簡潔方法。 – karim79 2010-05-06 11:13:08

676

對於單選擇DOM元素，以獲得當前選擇的值：

$('#dropDownId').val();

獲取當前選定的文本：

$('#dropDownId :selected').text();

來源

2010-05-06 11:11:23

您需要一個空間befor e'：選擇'。 – interjay 2010-05-06 11:15:45

+40

獲取所選選項文本的**最快方法是：'$（「＃dropDownId」）。children（「option」）.filter（「：selected」）.text（）' – RickardN 2013-03-21 10:22:07

我希望你鏈接對'.val（）'和'.text（）' – shareef 2013-07-09 13:35:04

你與ID提供您選擇元素？

<select id='dropDownId'> ...

您的第一個聲明應該工作！

來源

2010-05-06 11:15:18 schaechtele

var value = $('#dropDownId:selected').text()

應該可以正常工作，請參見下面的例子：

$(document).ready(function(){ 
 
    $('#button1').click(function(){ 
 
    alert($('#combo :selected').text()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="combo"> 
 
    <option value="1">Test 1</option> 
 
    <option value="2">Test 2</option> 
 
</select> 
 
<input id="button1" type="button" value="Click!" />

來源

2010-05-06 11:20:49

「值」是大多數編碼器錯過的，而聲明元素和查詢不斷返回文本 – 2014-09-16 02:40:38

試試這個jQuery的，

$("#ddlid option:selected").text();

或該JavaScript，

var selID=document.getElementById("ddlid"); 
var text=selID.options[selID.selectedIndex].text;

如果您需要訪問該值而不是文本，請嘗試使用val()方法而不是text()。

看看下面的小提琴鏈接。

Demo1 | Demo2

來源

2012-12-23 10:57:14 Lucky

再一次，爲javascript翻譯！有用的，如果你必須在線... – 2015-12-04 13:56:04

這將這樣的伎倆

$('#dropDownId').val();

來源

2013-03-03 07:12:03 Singleton

試試這個

$("#yourDropdown option:selected").text();

來源

2013-03-12 10:03:38 Kvadiyatar

OP是要求選定的價值。這個答案會得到下拉的文本內容。沒錯，只是不是他要求的。 – 2014-05-19 20:07:46

你的第一條語句應該工作！

var value = $('#dropDownId').val();

它將返回當前選定元素的值。

來源

2013-05-06 11:15:05 abhishek02

爲html中的下拉控件生成的id將是動態的。所以使用完整的ID $('ct100_<Your control id>').val().它會工作。

來源

2013-07-03 08:00:33 VenkeHV

另一個測試的例子：

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 
<script> 
$(document).ready(function(){ 
    $('#bonus').change(function() { 
    alert($("#bonus option:selected").text()); 
    }); 
}); 
</script> 
</head> 

<body> 
<select id="bonus"> 
<option value="1">-$5000</option> 
<option value="2">-$2500</option> 
<option value="3">$0</option> 
<option value="4">$1</option> 
<option value="5">We really appreciate your work</option> 
</select> 
</body> 
</html>

來源

2013-10-11 19:55:29

使用

$('#dropDownId').find('option:selected').val()

這應該工作:)

來源

2013-11-18 10:33:05 Namila

我知道這是舊的，但我雖然我有更多的最新更新此回答

$(document).on('change', '#combo', function() { 
var prepMin= $("#combo option:selected").val(); 
alert(prepMin); 
});

我希望這有助於

來源

2014-02-22 06:44:53 mindmyweb

$("select[id$=dropDownId]").val()

試試這個

來源

2014-03-14 06:07:17 rakesh

使用這兩種代碼

$('#dropDownId :selected').text();

$('#dropDownId').text();

來源

2014-04-18 08:52:08 Bipin

我知道這是一個可怕的舊帖子和我可能會被鞭打小號可憐的復活，但我想我會分享一些我在整個軍火庫我的每一個應用程序使用非常有用的小JS片斷......

如果打字：

$("#selector option:selected").val() // or 
$("#selector option:selected").text()

是年紀大了，試試添加這些小松餅到您的全局*.js文件：

function soval(a) { 
    return $('option:selected', a).val(); 
} 
function sotext(a) { 
    return $('option:selected', a).text(); 
}

和只寫soval("#selector");或sotext("#selector");，而不是！通過將兩者結合起來並返回一個包含value和text的對象，您甚至可以獲得更多！

function so(a) { 
    my.value = $('option:selected', a).val(); 
    my.text = $('option:selected', a).text(); 
    return my; 
}

它爲我節省了大量的寶貴時間，特別是在重型應用程序上！

來源

2014-05-08 22:22:10 DevlshOne

這將提醒選定的值。 jQuery代碼...

$(document).ready(function() { 

     $("#myDropDown").change(function (event) { 
      alert("You have Selected :: "+$(this).val()); 
     }); 
    });

HTML代碼...

<select id="myDropDown"> 
     <option>Milk</option> 
     <option>Egg</option> 
     <option>Bread</option> 
     <option>Fruits</option> 
    </select>

來源

2014-05-23 05:51:11 Uthaiah

或者，如果你想嘗試：

$("#foo").find("select[name=bar]").val();

我今天使用它，它工作正常。

來源

2014-08-22 13:28:38 SoLiD

$("#selector <b>></b> option:selected").val()

或者

$("#selector <b>></b> option:selected").text()

上面的代碼工作很適合我

來源

2015-07-02 13:04:57

只要使用這個

$('#select_id:selected').text();

來源

2015-07-30 12:34:06

應該是：$（'＃select_id：selected'）。text（）; – 2016-11-11 17:11:25

是的，你是對的.. !!! @美國隊長 – 2016-11-14 05:20:21

這是什麼工作

var value= $('option:selected', $('#dropDownId')).val();

來源

2015-10-28 12:06:09

所選文本的使用：

value: $('#dropDownId :selected').text();

對於選定值使用：

value: $('#dropDownId').val();

來源

2016-01-18 23:51:39 mahi

您可以使用任何這些：

$(document).on('change', 'select#dropDownId', function(){ 

      var value = $('select#dropDownId option:selected').text(); 

      //OR 

      var value = $(this).val(); 

});

來源

2016-04-08 13:37:34

試試這個，它得到的值：

$('select#myField').find('option:selected').val();

來源

2016-06-23 13:37:20

爲了從下降jQuery的價值減記你只需要使用下面的函數只是發送id並獲得選擇的值：

function getValue(id){ 
    var value = ""; 
    if($('#'+id)[0]!=undefined && $('#'+id)[0]!=null){ 
     for(var i=0;i<$('#'+id)[0].length;i++){ 
      if($('#'+id)[0][i].selected == true){ 
       if(value != ""){ 
        value = value + ", "; 
       } 
       value = value + $('#'+id)[0][i].innerText; 
      } 
     } 
    } 
    return value; 
}

來源

2016-09-13 07:28:40

你需要把這樣的。

$('[id$=dropDownId] option:selected').val();

來源

2017-01-09 14:08:50

$("#dropDownId").val('2'); 
var SelectedValue= $("#dropDownId option:selected").text(); 
$(".ParentClass .select-value").html(SelectedValue); 


<p class="inline-large-label button-height ParentClass" > 
    <label for="large-label-2" class="label">Country <span style="color: Red;">*</span><small></small></label> 
    <asp:DropDownList runat="server" ID="dropDownId " CssClass="select" Width="200px">   
    </asp:DropDownList> 
</p>

來源

2017-04-05 09:01:24

試試這個：

$('#dropDownId option').filter(':selected').text();  

$('#dropDownId option').filter(':selected').val();

來源

2017-10-25 09:22:17 saravanajd

使用下面的方法來獲取頁面加載所選值：

$(document).ready(function() { 
$('#ddlid').on('change', function() { 
       var value = $('#ddlid :selected').text(); 
       alert(value);` 
      }); 
});

來源

2017-12-30 05:16:15 UTHIRASAMY

使用jQuery獲取下拉菜單項的選定值

回答

相關問題