input type=tel 控制输入数字点击数字键盘的回车确认无反应，无法关闭数字键盘

标签：触发 relevant tel 数字键盘 value input event

input事件总结：

1、onfocus 当input获取到焦点时触发 2、onblur 当input失去焦点时触发，注意：这个事件触发的前提是已经获取了焦点再失去焦点的时候才会触发该事件，用于判断标签为空 3、onchange 当input失去焦点并且它的value值发生变化时触发 4、onkeydown 按下按键时的事件触发 5、onkeyup 当按键抬起的时候出发事件，再该事件出发之前一定出发了onkeydown事件，相当于一个按键，两个事件 6、onclick 主要用于type=“button”的时候，作为一个按钮使用时的鼠标点击事件 7、oninput 当input的value值发生变化时就会触发（与onchange的区别是不用等到失去焦点就可以触发了） 8、onselect 当input里的内容文本被选中后执行，只要选择了就会触发。

 

我们可以使用oninput事件去控制输入的内容：

  function onInput(event) {
      const targetValue = event.target.value;
      console.log(event.target, '------1');
      valueText = targetValue.replace(/[^/d]/g, '');
      value = Number(valueText)
      inputele.value = value
    }

　　

原因是点击回车确认，值没有发生变化，且input没有失去焦点，所以无反应；

 

可以点击除input外进行失去焦点处理，或者监听数字键盘回车键 后手动关闭数字键盘或手动使得input离焦即可

前者参考： https://blog.csdn.net/fanjun_/article/details/83587486?spm=1001.2101.3001.6650.4&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-4-83587486-blog-118076105.235%5Ev38%5Epc_relevant_yljh&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-4-83587486-blog-118076105.235%5Ev38%5Epc_relevant_yljh&utm_relevant_index=8

后者：

   function onBlur() {
      valid()
    }
    function onKeydown(event) {
      if (event.keyCode == '13') {
        document.activeElement.blur()
        onBlur()
        // this.$refs.input.blur() // 离焦会自己调用对应的函数
      }
    }

　　

标签：触发,relevant,tel,数字键盘,value,input,event
From： https://www.cnblogs.com/xhliang/p/17817157.html