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

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

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

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

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

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

更新:

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


当前回答

添加一个额外的选项作为第一个,就像一个列的标题,这将是下拉按钮的默认值,然后单击它并在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;
}

其他回答

您应该尝试使用option:selected

$("select option:selected").click(doSomething);

我知道这个问题现在已经很老了,但是对于仍然遇到这个问题的人来说,我已经通过向我的选项标记添加onInput事件来实现了这一点,然后在被调用的函数中,检索该选项输入的值。

<选择id='dropdown' on输入='myFunction()'> <选项value = " 1 " > < /选项> <选项value = " 2 " > < /选项> 选择< - > < p >输出:< / p > <跨越id =“输出”> < /跨越> <类型=“短信/ javascript脚本”> 我的功能() var optionValue =文档。getElementById(“dropdown”)。 文件输出getElementById(“”)。内html =选择值; 的 剧本< - >

只是一个想法,但有可能把每个<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())。

因此,我的目标是能够多次选择相同的值,这基本上覆盖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/

唯一对我有效的解决方案是完全重置SELECT on“onFocus”事件。这样,SELECT总是在"onChange"事件上"changes":

$('select').on('focus', function(ev) {
    var $select = $(this);
    var options = $select.html();
    $select.empty();
    $select.append(options);
});

$('select').on('change', function(ev) {
    // Now the select element ALWAYS fires onChange
});