尝试编辑select标签的onclick函数以调用option标签的onclick，现在的问题是它可能在FireFox中调用两次。

function getSelectedOption(select) {
    return select.options[select.selectedIndex];
}

查看实际操作-〉

<select onclick='getSelectedOption(this).click()'>
  <option onclick='log("foo")' >foo</option>
  <option onclick='log("bar")' >bar</option>
</select>

<p id="display"></p>

<script> 
function log(text) {
  document.getElementById('display').innerHTML = text;
}

function getSelectedOption(select) {
   return select.options[select.selectedIndex];
}
</script>

另外，这个问题是onclick在点击选项时被触发一次，在选择时被触发另一次（然后firefox又来处理另一次），所以，我发现修补这个问题的最好方法是将select标记的onchange改为onchange。
但可悲的是，这只是摆脱了最初的点击，而不是FireFox的正确方式点击...
所以，如果我们修改getSelectedOption函数来检查browser is chrome是否正确，那么我们就可以保护自己！

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;

我们的新函数如下所示...

clickSelectedOption(select) {
    if(!is_chrome) return;
    select.options[select.selectedIndex].click();
}

把所有东西都混在一起！

<select onchange='clickSelectedOption(this)'>
 <option onclick='log("foo")' >foo</option>
 <option onclick='log("bar")' >bar</option>
</select>

<p id="display"></p>

<script>
  var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
         
  function log(text) {
    document.getElementById('display').innerHTML = text;
  }

  function clickSelectedOption(select) {
    if(!is_chrome) return;
       select.options[select.selectedIndex].click();
  }
</script>

由@tkellehe给出的答案是正确的，但最好是使用这种逻辑的每一个浏览器，管理选择的选项与switch case语句或调用一个函数，将选定的选项值作为参数，因为仍然在2023年谷歌浏览器有相同的行为，像其他浏览器（onClick方法的选项只在Mozilla Firefox中工作）。
下面是一个React示例：

import React from 'react'

function App() {

  const callOptionFunction = () => {
      const select = document.getElementById("selectDropdown")
      const selectedOption = select.options[select.selectedIndex].value
      
      //call your parametric function
      yourFunction(selectedOption)
      
      //or call a different function based on the selected option value
      switch(selectedOption){
          case "1":
              yourFunction1()
              break
          case "2":
              yourFunction2()
              break
          case "3":
              yourFunction3()
              break
      }
  }

  return (
     <div>
       <select id="selectDropdown" onChange={() => callOptionFunction()}>
         <option value="1"  >1</option>
         <option value="2"  >2</option>
         <option value="3"  >3</option>
       </select>
     </div>
 )
}