jquery如何獲取select下拉選單選中項的值和文字

admin發表於2017-02-22
jQuery
select下拉選單是常用的表單元素之一，經常要獲取它的選中項的value屬性值和顯示的文字內容。

下面就通過例項簡單介紹一下如何獲取這兩個屬性值。

一.獲取value屬性值:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.softwhy.com/" />
<head>
<title>螞蟻部落</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript"> 
$(function(){ 
  $('#bt').click(function(){ 
    alert($('#myselect option:selected').val()); 
  }) 
}) 
</script> 
</head> 
<body> 
<select id="myselect"> 
<option value="1">螞蟻部落</option> 
<option value="2">css教程</option> 
<option value="3">javascript教程</option> 
</select> 
<input type="button" id="bt" value="獲取" /><br /> 
</body> 
</html>

以上程式碼可以彈出當前select下拉選單選擇項的value屬性值。

二.獲取文字屬性值:

在上面程式碼基礎將，將相應語句修改成以下程式碼即可:

[JavaScript] 純文字檢視 複製程式碼
alert($('#myselect option:selected').text());

相關文章