获取更改事件javascript上所有选项的值

Question

我希望在记录更改事件后知道select元素的所有值。

代码是这样的：

PHP

<select name='variant' class='variantsselect' onchange='on(this.value)'>
  <option value='a'>a</option>
  <option value='a'>a</option>
</select>

JAVASCRIPT

function on(value){
    alert(value); //This gives me selected value
};

我需要价值观a＆amp;在select元素上记录更改事件时b。有人可以帮忙吗？

Answer 1

<select name='variant' class='variantsselect' onchange="javascript:valueselect(this)">

function valueselect(sel) {
      var value = sel.options[sel.selectedIndex].value;
      alert(value)
   }

修改

<select name='variant' id='variant' class='variantsselect' onchange="javascript:displayResult()">

function displayResult() {
  var x = document.getElementById("variant");
  var i;
  var txt = "Text: ";

  for (i = 0; i < x.length; i++) {
    txt = txt + "\n" + x.options[i].text;
  }

 alert(txt);

}

Answer 2

您可以将最后选择的值存储在变量中，并使用函数末尾的新选择值覆盖变量。调用该函数时，变量将=选择最后一个选项（如果您没有设置默认值，则第一次调用时该变量将为空）

Click Here For Demo

或

这将适用于简单的隐藏/显示选择，而无需记住之前的选择。

隐藏/显示内容的类名称为HideShow，此类名称css显示设置为none。当您更改选项时，它将使用类名称HideShow循环遍历所有元素，以将所选值与元素的id进行比较，如果它们匹配，则将样式显示设置为block} else {将样式显示设置为无。

  

<强>演示   

＆＃13;

＆＃13;

function HideShow(Selection){
var HScontent=document.getElementsByClassName('HideShow');
for(var i=0; i<HScontent.length; i++){
    if(HScontent[i].id==Selection){
        HScontent[i].style.display="block";
    }else{
        HScontent[i].style.display="none";
    }
}
}

＆＃13;

.HideShow{display:none;}

＆＃13;

<select onchange="HideShow(this.value);">
<option value="cars">Cars</option>
<option value="bikes">Bikes</option>
<option value="buses">Buses</option>
</select>
<div id="cars" class="HideShow">Cars content.....</div>
<div id="bikes" class="HideShow">Bikes content....</div>
<div id="buses" class="HideShow">Buses content....</div>

＆＃13;

＆＃13;

＆＃13;

如果您对演示中的某些内容不了解，请在下面留言，我会尽快回复您。

我希望这会有所帮助。快乐的编码！