我是JavaScript和jQuery的新手。我想显示一个combobox-A,这是一个HTML <选择>与其选择的id和内容在onChange()的其他地方。
如何通过其选择id完整的组合框,以及如何通过onChange事件的其他参数?
我是JavaScript和jQuery的新手。我想显示一个combobox-A,这是一个HTML <选择>与其选择的id和内容在onChange()的其他地方。
如何通过其选择id完整的组合框,以及如何通过onChange事件的其他参数?
当前回答
JavaScript解决方案
<select id="comboA">
<option value="">Select combo</option>
<option value="Value1">Text1</option>
<option value="Value2">Text2</option>
<option value="Value3">Text3</option>
</select>
<script>
document.getElementById("comboA").onchange = function(){
var value = document.getElementById("comboA").value;
};
</script>
or
<script>
document.getElementById("comboA").onchange = function(evt){
var value = evt.target.value;
};
</script>
or
<script>
document.getElementById("comboA").onchange = handleChange;
function handleChange(evt){
var value = evt.target.value;
};
</script>
其他回答
如何在jQuery中做到这一点:
<select id="yourid">
<option value="Value 1">Text 1</option>
<option value="Value 2">Text 2</option>
</select>
<script src="jquery.js"></script>
<script>
$('#yourid').change(function() {
alert('The option with value ' + $(this).val() + ' and text ' + $(this).text() + ' was selected.');
});
</script>
你还应该知道Javascript和jQuery是不一样的。jQuery是有效的JavaScript代码,但并不是所有的JavaScript都是jQuery。你应该查找不同之处,并确保你使用的是合适的。
您可以尝试咆哮代码
<select onchange="myfunction($(this).val())" id="myId">
</select>
Html模板:
<select class="staff-select">
<option value="">All</option>
<option value="196">Ivan</option>
<option value="195">Jon</option>
</select>
Js代码:
const $staffSelect = document.querySelector('.staff-select')
$staffSelect.onchange = function () {
console.log(this.value)
}
jQuery的解决方案
我如何得到一个选定的选项的文本值
选择元素通常有两个要访问的值。 首先是要发送给服务器的值,这很简单:
$( "#myselect" ).val();
// => 1
第二个是选择的文本值。 例如,使用以下选择框:
<select id="myselect">
<option value="1">Mr</option>
<option value="2">Mrs</option>
<option value="3">Ms</option>
<option value="4">Dr</option>
<option value="5">Prof</option>
</select>
如果你想获得字符串“Mr”,如果选择了第一个选项(而不是“1”),你可以用下面的方式来做:
$( "#myselect option:selected" ).text();
// => "Mr"
另请参阅
.瓦尔()金刚火证件
如果有人正在寻找一个React解决方案,而不需要下载附加依赖项,你可以这样写:
<select onChange={this.changed(this)}>
<option value="Apple">Apple</option>
<option value="Android">Android</option>
</select>
changed(){
return e => {
console.log(e.target.value)
}
}
确保在构造函数中绑定changed()函数,如下:
this.changed = this.changed.bind(this);