javascript - 如何在javascript中获取select的值？

Question

这个问题已经有答案了:

Accessing an object property with a dynamically-computed name (19 个回答)

已关闭 4 年前。

我正在尝试从选择中获取值，如果选择错误，则会出现错误。例如:

<select name = "dogs" id = "dogs">                  
<option value="dog1">Dog 1</option>                 
<option value="dog2">Dog 2</option>
<option value="cat1">Cat 1</option>
</select>

如果有人选择了 cat1，他们会收到错误消息。

var x = document.getElementById("dogs");
var dogInspector = x.options[x.selectedIndex].value;

if(document.forms['form1'].dogInspector.value === "cat1"){
   document.getElementById("validate").innerHTML = "No cats allowed!";
   return false;
}

我不确定为什么这不起作用？是 if 语句吗？

Answer 1

使用x.value:

var x = document.getElementById("dogs");
x.addEventListener('change', (evt) => {
  if(x.value === "cat1"){
     alert("No cats allowed!");
  }
});

<select name="dogs" id="dogs">                  
  <option value="dog1">Dog 1</option>                 
  <option value="dog2">Dog 2</option>
  <option value="cat1">Cat 1</option>
</select>