Safari不会按时触发select元素上的click事件

时间:2018-05-28 12:48:18

标签: javascript drop-down-menu vue.js safari

Chrome和Firefox会同时点击选择元素上的点击事件并打开其选项菜单,但在选项菜单关闭之前,Safari不会触发事件。 我需要点击事件立即点击,任何解决方法吗?

我在Safari 9和10上测试过。 这是小提琴:https://jsfiddle.net/hafez/nm3170v5/

<div id="app">
   <select @click="runTest($event)" v-model="selectedValue">
       <option value>select to check your browser</option>
       <option value="1">first</option>
       <option value="2">second</option>
   </select>
</div>

new Vue({
  el: "#app",
  data: {
        selectedValue: ''
  },
  methods: {
    runTest(event) {
      if(event.target.value) {
        alert("It's too late to show an alert! I said on-clik stupid browser!");
      } else {
        alert("Alert on time! Good job dear browser!");
      }
      this.selectedValue = '';
    }
  }
})

注意:在我的实际代码中,我必须使用stopPropagation preventDefaultclick.stop.prevent,因此解决方案应满足此条件。

1 个答案:

答案 0 :(得分:3)

尝试使用mousedown代替clickFiddle)。

备注

click afaik将在释放鼠标按钮时触发事件,而mousedown将在按下鼠标按钮时触发事件。这可能是延迟处理程序执行的原因。