JS登录界面禁止输入空格

在做登录界面时存在用户输入无效字符的情况，可以用JS键盘输入事件keypress监听输入字符，当字符无效时执行JS回调函数

字符串方法

一开始打算监听键盘输入事件时，当输入无效字符时删除字符value值最后一位字符
substring()

结果发现使用该方法后出现意想不到的bug，经过断点调试后发现keypress的执行顺序为先执行监听事件中的回调函数，当所有回调函数执行完毕后才会键入字符

input.addEventListener('keypress',function(e){
                if(e.charCode==49){//当输入1时触发
                    setTimeout(function(){
                        console.log(input.value);//当输入321时输出321
                    },0)
                    console.log(input.value);//当输入321时输出32
                }
            })

如果用keyup可以实现先键入字符再执行回调函数功能，但当用户长按键盘时会键入多次而只执行一次回调函数

取消默认事件

可以用当监听到键入无效字符时候使用取消默认事件使本次输入无效

 input.addEventListener('keypress',function(e){
                if(e.charCode==32){//按下空格键触发
                    e.preventDefault();
                }
            })