我有一个输入表单，它允许我从多个选项中进行选择，并在用户更改选择时执行一些操作。例如,
<select onChange="javascript:doSomething();">
<option>A</option>
<option>B</option>
<option>C</option>
</select>
现在，doSomething()只在选择改变时被触发。
我想在用户选择任何选项时触发doSomething()，可能是相同的选项。
我已经尝试使用“onClick”处理程序，但在用户开始选择过程之前被触发。
那么，是否有一种方法在用户每次选择时触发一个函数?
更新:
Darryl提出的答案似乎有效，但并不总是有效。有时，当用户单击下拉菜单时，甚至在用户完成选择过程之前，事件就会被触发!
当前回答
请注意，IE上的OPTION标签不支持事件处理程序，我想出了这个解决方案，尝试一下，给我你的反馈:
<script>
var flag = true;
function resetIndex(selObj) {
if(flag) selObj.selectedIndex = -1;
flag = true;
}
function doSomething(selObj) {
alert(selObj.value)
flag = false;
}
</script>
<select onchange="doSomething(this)" onclick="resetIndex(this)">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
我在这里所做的实际上是重置选择索引，这样onchange事件就会一直被触发，当你点击时，我们会失去所选的项目，如果你的列表很长，这可能会很烦人，但它可能在某种程度上帮助你。
其他回答
这是最简单的方法:
<select name="ab" onchange="if (this.selectedIndex) doSomething();">
<option value="-1">--</option>
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>
工作与鼠标选择和键盘上/下键时，选择是集中。
关于select标记(在这个场景中)的奇妙之处在于它将从选项标记中获取它的值。
Try:
<select onChange="javascript:doSomething(this.value);">
<option value="A">A</option>
<option value="B">B</option>
<option value="Foo">C</option>
</select>
对我来说还不错。
我要扩展一下jitbit的答案。当你点击下拉菜单，然后不选择任何东西就关闭下拉菜单时，我觉得很奇怪。最后得出了如下结论:
var lastSelectedOption = null; DDChange = function(Dd) { //Blur after change so that clicking again without //losing focus re-triggers onfocus. Dd.blur(); //The rest is whatever you want in the change. var tcs = $("span.on_change_times"); tcs.html(+tcs.html() + 1); $("span.selected_index").html(Dd.prop("selectedIndex")); return false; }; DDFocus = function(Dd) { lastSelectedOption = Dd.prop("selectedIndex"); Dd.prop("selectedIndex", -1); $("span.selected_index").html(Dd.prop("selectedIndex")); return false; }; //On blur, set it back to the value before they clicked //away without selecting an option. // //This is what is typically weird for the user since they //might click on the dropdown to look at other options, //realize they didn't what to change anything, and //click off the dropdown. DDBlur = function(Dd) { if (Dd.prop("selectedIndex") === -1) Dd.prop("selectedIndex", lastSelectedOption); $("span.selected_index").html(Dd.prop("selectedIndex")); return false; }; <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="Dd" onchange="DDChange($(this));" onfocus="DDFocus($(this));" onblur="DDBlur($(this));"> <option>1</option> <option>2</option> </select> <br/> <br/>Selected index: <span class="selected_index"></span> <br/>Times onchange triggered: <span class="on_change_times">0</span>
这对用户来说更有意义，并且允许JavaScript在每次选择任何选项(包括先前的选项)时运行。
这种方法的缺点是，它破坏了在下拉菜单上使用tab键并使用方向键选择值的功能。这对我来说是可以接受的，因为所有用户都会一直点击所有内容，直到永恒结束。
添加一个额外的选项作为第一个，就像一个列的标题，这将是下拉按钮的默认值，然后单击它并在doSomething()的末尾重置，因此当选择a /B/C时，onchange事件总是触发，当选择为State时，什么都不做并返回。正如很多人之前提到的，Onclick非常不稳定。所以我们所需要做的就是做一个初始的按钮标签，这是不同于你的真正的选项，所以onchange将工作在任何选项。
<select id="btnState" onchange="doSomething(this)">
<option value="State" selected="selected">State</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
function doSomething(obj)
{
var btnValue = obj.options[obj.selectedIndex].value;
if (btnValue == "State")
{
//do nothing
return;
}
// Do your thing here
// reset
obj.selectedIndex = 0;
}
我找到了这个解。
初始化select元素的selectedIndex为0
//set selected Index to 0
doSomethingOnChange(){
blah ..blah ..
set selected Index to 0
}
将此方法调用为onChange事件
