我有一个输入表单,它允许我从多个选项中进行选择,并在用户更改选择时执行一些操作。例如,

<select onChange="javascript:doSomething();">
  <option>A</option>
  <option>B</option>
  <option>C</option>
</select>

现在,doSomething()只在选择改变时被触发。

我想在用户选择任何选项时触发doSomething(),可能是相同的选项。

我已经尝试使用“onClick”处理程序,但在用户开始选择过程之前被触发。

那么,是否有一种方法在用户每次选择时触发一个函数?

更新:

Darryl提出的答案似乎有效,但并不总是有效。有时,当用户单击下拉菜单时,甚至在用户完成选择过程之前,事件就会被触发!


当前回答

因此,我的目标是能够多次选择相同的值,这基本上覆盖onchange()函数,并将其转化为有用的onclick()方法。

基于上面的建议,我想出了这个适合我的方法。

<select name="ab" id="hi" onchange="if (typeof(this.selectedIndex) != undefined) {alert($('#hi').val()); this.blur();}" onfocus="this.selectedIndex = -1;">
    <option value="-1">--</option>
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
</select>

http://jsfiddle.net/dR9tH/19/

其他回答

只是一个想法,但有可能把每个<option>元素的onclick ?

<select>
  <option onclick="doSomething(this);">A</option>
  <option onclick="doSomething(this);">B</option>
  <option onclick="doSomething(this);">C</option>
</select>

另一种选择是在选择上使用onblur。这将在用户单击离开选择时触发。此时,您可以确定选择了什么选项。为了在正确的时间触发,选项的onclick可以模糊字段(在jQuery中使其他东西活跃或只是.blur())。

关于select标记(在这个场景中)的奇妙之处在于它将从选项标记中获取它的值。

Try:

<select onChange="javascript:doSomething(this.value);">
<option value="A">A</option>
<option value="B">B</option>
<option value="Foo">C</option>
</select>

对我来说还不错。

我找到了这个解。

初始化select元素的selectedIndex为0

//set selected Index to 0

doSomethingOnChange(){

     blah ..blah ..

     set selected Index to 0

}

将此方法调用为onChange事件

2022香草javascript

...因为这是谷歌的热门节目。

最初的海报没有要求一个JQuery解决方案,但所有的答案只演示JQuery或内联选择标签事件。

使用'change'事件监听器。

const selectDropdown = document.querySelector('select');
selectDropdown.addEventListener('change', function (e) { /* your code */ });

... 或者调用一个单独的函数:

function yourFunc(e) { /* your code here */ }

const selectDropdown = document.querySelector('select');
selectDropdown.addEventListener('change', yourFunc);

很久以前的事了,但在回答最初的问题时,这有帮助吗? 只要把onClick放到SELECT行。 然后在OPTION行中放入您想要每个OPTION做的事情。 即:

<SELECT name="your name" onClick>
<option value ="Kilometres" onClick="YourFunction()">Kilometres
-------
-------
</SELECT>