为什么keydown不能在移动设备上工作？ vue.js 2

问题描述：

<template> 
    ... 
    <input type="number" class="form-control" v-model="quantity" min="1" v-on:keydown="disableDot"> 
    ...       
</template> 
<script> 
    export default{ 
     ... 
     methods:{ 
      disableDot: function(evt) { 
       evt = (evt) ? evt : window.event 
       let charCode = (evt.which) ? evt.which : evt.keyCode 
       if (charCode === 190 || charCode === 189 || charCode === 187) { 
        evt.preventDefault() 
       } 
       else { 
        return true 
       } 
      } 

     } 
    } 
</script>

如果执行的代码和我的输入点，它仍然可以

在dekstop，它有禁用（）。但在移动，它不禁用

我想禁用点。所以用户不能输入点号

我该怎么办？

注意

在dekstop，代码工作。但在移动设备中，代码不起作用。移动中的点（。）没有禁用

答

问题在于，使用'keydown'或'keyup'的键码在各个浏览器中似乎不一致。也许操作系统也有影响。你可以在各种浏览器和移动设备上测试here

我想你会发现更多的一致性，而不是使用v-on:keypress事件。在我的快速（不完整的移动设备）测试中，以下内容一致返回“46”。快速警告，我注意到键入'。'在我的Android键盘上的Firefox手机我收到两个按键事件。

//in template 
<input type="number" v-on:keypress="capturePress($event)"> 

//in methods 
capturePress: function(event) { 
    console.log(event.charCode); 
}

我也鼓励你看看整个事件，因为它也返回。 event.code = "Period"和event.key = "."虽然只有event.key = "."被填充到手机的Firefox。

console.log(event);

为什么keydown不能在移动设备上工作？ vue.js 2

相关推荐