我有一个输入表单，它允许我从多个选项中进行选择，并在用户更改选择时执行一些操作。例如,
<select onChange="javascript:doSomething();">
<option>A</option>
<option>B</option>
<option>C</option>
</select>
现在，doSomething()只在选择改变时被触发。
我想在用户选择任何选项时触发doSomething()，可能是相同的选项。
我已经尝试使用“onClick”处理程序，但在用户开始选择过程之前被触发。
那么，是否有一种方法在用户每次选择时触发一个函数?
更新:
Darryl提出的答案似乎有效，但并不总是有效。有时，当用户单击下拉菜单时，甚至在用户完成选择过程之前，事件就会被触发!
当前回答
这可能不能直接回答你的问题，但这个问题可以通过简单的设计调整来解决。我知道这可能不是100%适用于所有用例，但我强烈建议您重新考虑您的应用程序的用户流程，以及以下设计建议是否可以实现。
我决定做一些简单的事情，而不是黑客onChange()使用其他事件的替代方案，这并不是真正意义上的目的(模糊，点击等)。
我的解决方法是:
只需预先挂起一个没有任何值的占位符选项标记，如select。
所以，不要只使用下面的结构，这需要一些hack-y替代方案:
<select>
<option>A</option>
<option>B</option>
<option>C</option>
</select>
考虑使用这个:
<select>
<option selected="selected">Select...</option>
<option>A</option>
<option>B</option>
<option>C</option>
</select>
因此，通过这种方式，您的代码更加简化，并且每当用户决定选择默认值以外的内容时，onChange将按预期工作。如果您不希望他们再次选择第一个选项，甚至可以将disabled属性添加到第一个选项，并强制他们从选项中选择一些内容，从而触发onChange()触发。
At the time of this answer, I'm writing a complex Vue application and I found that this design choice has simplified my code a lot. I spent hours on this problem before I settled down with this solution and I didn't have to re-write a lot of my code. However, if I went with the hacky alternatives, I would have needed to account for the edge cases, to prevent double firing of ajax requests, etc. This also doesn't mess up the default browser behaviour as a nice bonus (tested on mobile browsers as well).
有时候，你只需要退一步，从大局出发，寻找最简单的解决方案。
其他回答
另一个解决方案是使用onMouseUp事件。 OnMouseUp也与相同的选项重新选择以及改变选项。
只有劣势。当打开下拉框时调用该代码，当做出选择时调用第二次。对于AJAX请求，请记住这一点。 如果这不会损害你的逻辑，你可以使用它作为一个简单的内联黑客。
<select id="bla" onmouseup="console.log( document.getElementById('bla').options[document.getElementById('bla').selectedIndex].value );">
<option value="0">A</option>
<option value="1">B</option>
</select>
如果你真的需要它像这样工作，我会这样做(以确保它通过键盘和鼠标工作)
在select中添加一个onfocus事件处理程序来设置“current”值 向选择中添加onclick事件处理程序以处理鼠标更改 向select添加onkeypress事件处理程序以处理键盘更改
不幸的是，onclick将运行多次(例如，在打开选择…在选择/关闭时)和onkeypress可能会在没有变化时触发…
<script>
function setInitial(obj){
obj._initValue = obj.value;
}
function doSomething(obj){
//if you want to verify a change took place...
if(obj._initValue == obj.value){
//do nothing, no actual change occurred...
//or in your case if you want to make a minor update
doMinorUpdate();
} else {
//change happened
getNewData(obj.value);
}
}
</script>
<select onfocus="setInitial(this);" onclick="doSomething();" onkeypress="doSomething();">
...
</select>
我找到了这个解。
初始化select元素的selectedIndex为0
//set selected Index to 0
doSomethingOnChange(){
blah ..blah ..
set selected Index to 0
}
将此方法调用为onChange事件
我曾经遇到过类似的需求，最终为同样的-写了一个angularjs指令
Guthub链接-角选择
使用元素[0].blur ();将焦点从选择标记上移除。逻辑是触发这种模糊的第二次点击下拉菜单。
即使用户在下拉菜单中选择了相同的值，也会触发As-select。
DEMO - link
<select name="test[]"
onchange="if(this.selectedIndex < 1){this.options[this.selectedIndex].selected = !1}">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
