如何在html选择onChange上传递参数

我是JavaScript和jQuery的新手。我想显示一个combobox-A，这是一个HTML <选择>与其选择的id和内容在onChange()的其他地方。

如何通过其选择id完整的组合框，以及如何通过onChange事件的其他参数?

当前回答

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)
}

2021-07-26 03:38:39

其他回答

如果有人正在寻找一个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);

2019-10-30 06:35:36

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>

<script>
 document.getElementById("comboA").onchange = function(evt){
    var value = evt.target.value;
 };
</script>

<script>
 document.getElementById("comboA").onchange = handleChange;

 function handleChange(evt){
    var value = evt.target.value;
 };
</script>

2019-02-28 06:05:38

简单:

函数检索(){ 警报(. getelementbyid (SMS_recipient) .options [. getelementbyid(“SMS_recipient”).selectedIndex]。text); ｝

function retrieve_other() { alert(myForm.SMS_recipient.options[document.getElementById('SMS_recipient').selectedIndex].text); } function retrieve() { alert(document.getElementById('SMS_recipient').options[document.getElementById('SMS_recipient').selectedIndex].text); } <HTML> <BODY> <p>RETRIEVING TEXT IN OPTION OF SELECT </p> <form name="myForm" action=""> <P>Select: <select id="SMS_recipient"> <options value='+15121234567'>Andrew</option> <options value='+15121234568'>Klaus</option> </select> </p> <p>  <input type="button" onclick="retrieve()" value="Try it" /> <input type="button" onclick="retrieve_other()" value="Try Form" /> </p> </form> </HTML> </BODY>

输出: Klaus或Andrew取决于selectedIndex是什么。如果你想要的是值，只需将.text替换为value。然而，如果它只是你想要的值(而不是选项中的文本)，那么使用document.getElementById(' sms_receiver ').value

2021-02-06 03:16:20

函数setMyValue(v) { console.log (v); ｝ <选择onchange = " setMyValue (this.value)" > <选项值= " " > 1 > < /选项 <选项值= " b " > 2 > < /选项 <选项值= " c " > 3 < /选项> < /选择>

2022-07-27 18:52:27

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)
}

2021-07-26 03:38:39

如何在html选择onChange上传递参数

推荐文章

最新文章

标签