试试这个:

<select id="nameSelect" onfocus="javascript:document.getElementById('nameSelect').selectedIndex=-1;" onchange="doSomething(this);">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>

这可能不能直接回答你的问题，但这个问题可以通过简单的设计调整来解决。我知道这可能不是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).

有时候，你只需要退一步，从大局出发，寻找最简单的解决方案。

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

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

这里有几件事要做，以确保它记住旧的值，并在再次选择相同的选项时触发onchange事件。

首先你需要一个常规的onChange事件:

$("#selectbox").on("change", function(){
    console.log($(this).val());
    doSomething();
});

要想在再次选择相同的选项时触发onChange事件，可以在下拉菜单接收焦点时通过将其设置为无效值来取消设置所选选项。但你也想存储之前选择的值，以便在用户没有选择任何新选项的情况下恢复它:

prev_select_option = ""; //some kind of global var

$("#selectbox").on("focus", function(){
    prev_select_option = $(this).val(); //store currently selected value
    $(this).val("unknown"); //set to an invalid value
});

上面的代码将允许您触发onchange，即使选择了相同的值。但是，如果用户在选择框外单击，则希望恢复以前的值。我们在onBlur上做:

$("#selectbox").on("blur", function(){
    if ($(this).val() == null) { 
       //because we previously set an invalid value 
       //and user did not select any option
        $(this).val(prev_select_option);
    }
});

唯一对我有效的解决方案是完全重置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
});