码迷,mamicode.com
首页 > 其他好文 > 详细

回车提交表单

时间:2016-05-25 09:25:05      阅读:159      评论:0      收藏:0      [点我收藏+]

标签:

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

今天我们就来实现一下:

原理:

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="请输入用户名">

 

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

技术分享

回车提交表单

标签:

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!