回车提交表单

填写完表单数据之后,很多用户喜欢直接按回车提交,感觉速度比较快,省去了拿鼠标找“提交”按钮再单击的时间。

今天我们就来实现一下:

原理:

1,获取“Enter”按键的code:

 兼容不同的浏览器的写法如下:

var keyCode = e.keyCode || e.which || e.charCode

2,监听键盘onkeyup事件:

window.onkeyup = function(e){
  e = e || window.event; //获取事件对象  
}

3,判断code键码是否为13(代表enter的键码)

var keyCode = e.keyCode || e.which || e.charCode; //获取键码
if(keyCode === 13){
  alert('你按下了enter键');
}else{
  alert('你不是按的enter键')
}

详细的javascript代码:

window.onkeyup = function(e){
    e = e || window.event;
    var keyCode = e.keyCode || e.which || e.charCode;
    if(keyCode === 13){
        if(userName.value.length > 0){
            alert('提交成功!')
        }else{
            userName.focus();
        }
    }
}        

HTML:

<input id="userName" type="text" placeholder="请输入用户名">

扫描二维码关注微信公众号:

原文地址:https://www.cnblogs.com/White-Quality/p/5525723.html