JavaScript 点击回车验证提交表单
JavaScript 点击回车验证提交表单属于前端实例代码，有关更多实例代码大家可以查看。
回车键是应用最为频繁的按键之一，对其恰当的应用可以节省很多操作。
比如在使用QQ聊天的时候，点击回车就可以发送信息，而不是使用鼠标点击。
与上面情形类似，表单提交验证的时候，也可以利用回车键来提升一下用户体验。
表单填写完毕之后，无需挪动鼠标点击提交按钮，只要点击回车即可实现表单验证与提交功能。
代码实例如下：
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.pipipi.net/" />
<script>
window.onload=function(){
let txt=document.getElementById("txt");
let st=document.getElementById("st");
let form=document.forms[0];
form.onsubmit=function(){
if(txt.value==""){
alert("请先写一些内容");
txt.focus();
return false;
}
}
document.onkeydown = function(e){
if(ev.keyCode==13&&document.activeElement === form) {
form.submit();
}
}
}
</script>
</head>
<body>
<form action="#" id="fm">
<input type="text" id="txt" name="txt">
<input type="submit" id="st" name="st">
</form>
</body>
</html>
上述代码可以实现文本框提交内容是否为空的简单验证。
代码运行效果截图如下：
点击提交按钮和回车都会实现验证功能，下面详细分析一下实现过程。
（1）.首先为form表单注册submit事件处理函数，此事件处理函数能够实现文本是否为空的验证。
（2）.点击提交按钮可以触发验证事件，这个很简单，不多介绍，下面着重介绍如何实现点击回车验证表单。
（3）.为document注册keydown事件，在页面中点击任何按键都可以触发此事件，下面的任务是筛选点击回车按键。
（4）.如果ev.keyCode等于13，那么说明当前按键就是回车键。
（5）.但是最好不要再页面任何情况下点击回车键都会触发submit事件，可能其他功能也有对回车的响应功能。
（6）.所以最好当焦点依然处于form中时，能够响应回车.
（7）.document.activeElement === form可以实现焦点是否在表单中的判断。
上面已经将功能具体实现过程进行了一下介绍，更多内容可以参阅下面文章。
相关阅读：
（1）.keyCode参阅JavaScript keyCode一章节。
（2）.document.activeElement参阅document.activeElement一章节。
（3）.return false参阅JavaScript return false一章节。
JavaScript 点击回车验证提交表单，这样的场景在实际项目中还是用的比较多的，关于JavaScript 点击回车验证提交表单就介绍到这了。