jquery 选择更改事件获取选择选项
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12750307/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery select change event get selected option
提问by Zulakis
I bound an event on the change event of my select elements with this:
我在我的选择元素的更改事件上绑定了一个事件：
$('select').on('change', '', function (e) {
});
How can I access the element which got selected when the change event occurs?
如何访问发生更改事件时选择的元素？
回答by Naftali aka Neal
$('select').on('change', function (e) {
var optionSelected = $("option:selected", this);
var valueSelected = this.value;
....
});
回答by Bellash
You can use the jQuery findmethod
您可以使用jQuery find方法
$('select').change(function () {
var optionSelected = $(this).find("option:selected");
var valueSelected = optionSelected.val();
var textSelected = optionSelected.text();
});
The above solution works perfectly but I choose to add the following code for them willing to get the clicked option. It allows you get the selected option even when this select value has not changed. (Tested with Mozilla only)
上述解决方案完美无缺，但我选择为愿意获得点击选项的他们添加以下代码。即使此选择值未更改，它也允许您获得所选选项。（仅使用 Mozilla 测试）
$('select').find('option').click(function () {
var optionSelected = $(this);
var valueSelected = optionSelected.val();
var textSelected = optionSelected.text();
});
回答by DanielST
Delegated Alternative
委托替代
In case anyone is using the delegated approachfor their listener, use e.target(it will refer to the select element).
如果有人对其侦听器使用委托方法，请使用e.target（它将指代 select 元素）。
$('#myform').on('change', 'select', function (e) {
var val = $(e.target).val();
var text = $(e.target).find("option:selected").text(); //only time the find is required
var name = $(e.target).attr('name');
}
回答by 1.44mb
I find this shorter and cleaner. Besides, you can iterate through selected items if there are more than one;
我觉得这更短更干净。此外，如果有多个，您可以遍历选定的项目；
$('select').on('change', function () {
var selectedValue = this.selectedOptions[0].value;
var selectedText = this.selectedOptions[0].text;
});
回答by 1.44mb
<select id="selectId">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
$('#selectId').on('change', function () {
var selectVal = $("#selectId option:selected").val();
});
First create a select option. After that using jqueryyou can get current selected value when user change select optionvalue.
首先创建一个select option. 之后使用jquery您可以在用户更改select option值时获取当前选择的值。
回答by Serdar Karaca
$('#_SelectID').change(function () {
var SelectedText = $('option:selected',this).text();
var SelectedValue = $('option:selected',this).val();
});
回答by Recep Can
Another and short way to get value of selected value,
获取选定值的另一种简短方法，
$('#selectElement').on('change',function(){
var selectedVal = $(this).val();
^^^^ ^^^^ -> presents #selectElement selected value
|
v
presents #selectElement,
});
回答by alex Roosso
See official API documentation https://api.jquery.com/selected-selector/
见官方API文档 https://api.jquery.com/selected-selector/
This good works:
这个好作品：
$( "select" ).on('change',function() {
var str = "";
// For multiple choice
$( "select option:selected" ).each(function() {
str += $( this ).val() + " ";
});
});
and
和
$( "select" ).on('change',function() {
// For unique choice
var selVal = $( "select option:selected" ).val();
});
and be easy for unique choice
并且很容易做出独特的选择
var SelVal = $( "#idSelect option:selected" ).val();
回答by Developer
You can use this jquery select change event for get selected option value
您可以使用此 jquery 选择更改事件来获取选定的选项值
$(document).ready(function () {
$('body').on('change','#select', function() {
$('#show_selected').val(this.value);
});
}); <!DOCTYPE html>
<html>
<title>Learn Jquery value Method</title>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<select id="select">
<option value="">Select One</option>
<option value="PHP">PHP</option>
<option value="jAVA">JAVA</option>
<option value="Jquery">jQuery</option>
<option value="Python">Python</option>
<option value="Mysql">Mysql</option>
</select>
<br><br>
<input type="text" id="show_selected">
</body>
</html> 