极客观点
项目管理
HarmonyOS
最近新学习了javascr1ipt ，写了 一个邮箱验证，我想将邮箱验证按钮和回车键绑定在一起;
遇到的问题， 在光标移开邮箱填写栏后任然需要点击验证按钮再回车才能显示验证结果;
&ems; 想要效果 希望在光标移开邮箱填写栏后，直接点击回车键；得到验证的结果;
javascript 部分代码
<script type="text/javascript">
window.onload=function(){
// 当邮箱填写完成后
document.getElementById("email").onblur=function(){
// 当开始按下键盘后
document.getElementById("btn").onkeydown=function(event){
if(event.keyCode==13){
//拿到邮箱;
var emails=document.getElementById("email").value;
// 创建正则;
var emailEegExp=/^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/;
//经行验证;
if( !emailEegExp.test(emails)){
// 显示验证结果;
document.getElementById("errorMessage").innerText="填写邮箱有误";
}
}
}
}
//重新填写
document.getElementById("email").onfocus=function(){
document.getElementById("errorMessage").innerText="";
}
}
</script>
全部代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>邮箱正则验证</title>
</head>
<body>
<script type="text/javascript">
window.onload=function(){
// 当邮箱填写完成后
document.getElementById("email").onblur=function(){
// 当开始按下键盘后
document.getElementById("btn").onkeydown=function(event){
if(event.keyCode==13){
//拿到邮箱;
var emails=document.getElementById("email").value;
// 创建正则;
var emailEegExp=/^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/;
//经行验证;
if( !emailEegExp.test(emails)){
// 显示验证结果;
document.getElementById("errorMessage").innerText="填写邮箱有误";
}
}
}
}
//重新填写
document.getElementById("email").onfocus=function(){
document.getElementById("errorMessage").innerText="";
}
}
</script>
<input type="text" name="" id="email" value="" />
<span id="errorMessage" style="color: red; font-size: 17px;"> </span>
<br>
<input type="button" name="" id="btn" value="邮箱验证" />
</body>
</html>有大神能够告诉我为什么我在光标移开邮箱填写栏之后任然需要点击验证按钮再按下回车键才能完成验证呢？？？
只有获得焦点的元素才能监听键盘事件。
即便你的邮箱填写框已经失去焦点，焦点可能回到了
window上，即只有window可以监听到键盘事件，所以你可以在修改按钮的onkeydown之前把焦点给按钮: