使用jQuery在下拉选项字段中读取所选值

Question

我想使用jQuery读取下拉列表中选择的值。

我的HTML：

<select id="selectValue">
  <option value="Yes">Yes</option>
  <option value="No">No</option>                         
</select>

我的jQuery：

$(document).ready(function () {
  var Value = $("#selectValue option:selected").text();
  alert(Value);
});

有谁能告诉我我的代码有什么问题？ 这是一个在debbuger中的结果，

Answer 1

尝试val()方法：

$(document).ready(function () {
  var Value = $("#selectValue").val();
  alert(Value);
});

Answer 2

试试这个

 $('#yourDropdownId').change(function(){
     var selectedid=$('#yourDropdownId').val();
      alert(selectedid);
   });

Answer 3

试试这个

$(document).ready(function () {
 var Value = $("#selectValue").find(":selected").text();
  alert(Value );
});

Answer 4

＆＃13;

＆＃13;

$('button').click(function() {
	var value = $('#selectValue').val();
	var text = $('option[value="' + value + '"]', $('#selectValue')).text();
	
	console.log(value);
	console.log(text);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="selectValue">
  <option value="YesKey">Yes</option>
  <option value="NoKey">No</option>                         
</select>

<button>get selected value</button>

＆＃13;

＆＃13;

＆＃13;

或者你可以扩展jQuery：

＆＃13;

＆＃13;

jQuery.fn.extend({
  valText: function() {
    return jQuery('option[value="' + jQuery(this).val() + '"]', jQuery(this)).text();
  }
});

$('button').click(function() {
  console.log($('#selectValue').valText());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id="selectValue">
  <option value="YesKey">Yes</option>
  <option value="NoKey">No</option>                         
</select>

<button>get selected value</button>

＆＃13;

＆＃13;

＆＃13;