Question

<select>
   <option value="">Select</option>
   <option value="10000">Minimum Coverage</option>
   <option value="25000">Average Coverage</option>
   <option value="">Other</option>
</select>

我必须让“Select”和“Other”都有空值，因为该字段的验证规则不允许除空字符串或数值之外的其他任何内容。

最重要的是，我需要能够检测用户何时开启“选择”并点击“其他”。有可能吗？

编辑：onChange似乎没有开火。

Answer 1

您可以查看selectedIndex属性。如果您想在每次项目更改时发生某些事情，请使用onchange事件绑定。

document.getElementsByTagName('select')[0].onchange = function() {
  var index = this.selectedIndex;
  var inputText = this.children[index].innerHTML.trim();
  console.log(inputText);
}

FIDDLE

Answer 2

change事件肯定会触发，即使更改的选项具有相同的值：

jsfiddle.net/kyw2E

在change事件处理程序中，您可以检查this.selectedIndex属性以确定选择了哪个<option>。然后，您可以检查所选选项的text属性，如果这有用：

coverageSelector.onchange = function (e) {
    var selectedOption = this[this.selectedIndex];
    var selectedText = selectedOption.text;
}

Answer 3

简称为：

 var mySelect = document.getElementById('#mySelect');
 mySelect.onchange = (event) => {
     var inputText = event.target.value;
     console.log(inputText);
 }

如果在具有相同值的两个选项之间进行更改，如何检测选择更改事件？

3 个答案: