首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

怎么获得表单焦点

2013-02-27 
如何获得表单焦点例如:当邮箱错误的提示框出来后,点玩确定又重新跑到此文本框来重新获得焦点我用的是onblu

如何获得表单焦点
例如:当邮箱错误的提示框出来后,点玩确定又重新跑到此文本框来重新获得焦点
我用的是onblur事件注册的函数,当失去焦点的时候触发checkemail函数,尽管写了document.getElementById("eml").focus();还是不管用,大侠们帮帮我了!希望吃完饭后有个好的解答,谢谢!我会尽快结贴的!


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>登录</title>
<link href="style/style2.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
//检查邮箱
function checkemail(){
var myemail=document.getElementById("eml").value;
var mesg_error= document.getElementById("emai_error");
if(myemail!="")
{//查找@,如果没有就返回-1
if(myemail.indexOf("@")==-1||myemail.indexOf(".")==-1||(myemail.indexOf("@")>myemail.indexOf(".")))
{
//mesg_error.innerHTML="<font color='red'></font>";
alert("email格式不正确!例:xiaoniu@qq.com");
document.getElementById("eml").focus();
return false;
}
else
{
mesg_error.innerHTML="<font color='red'>√</font>";
return true;
}
}
else
{
alert("email不能为空!")
//mesg_error.innerHTML="<font color='red'>email不能为空!</font>";
document.getElementById("eml").focus();
return false;
}


}

//检查密码
function checkpwd()  
{
 var mypwd=document.getElementById("pwd").value;
 var pwd_error=document.getElementById("pwd_error");
 if(mypwd=="")
 {
  //pwd_error.innerHTML="<font color='red'>密码不能为空!</font>";
  alert("密码不能为空");
  return false;
 }
 else if(mypwd.length>=6&&mypwd.length<=16)
 {
  
   pwd_error.innerHTML="<font color='red'>√</font>";
  return true;
 }
 else
 {
 //pwd_error.innerHTML="<font color='red'>密码至少应为6位到16位!</font>";
   alert("密码至少应为6位到16位!");
  return false;
 }
}

//检查确认密码
function checkpwdd()
{
var mypwdd=document.getElementById("pwdd").value;
var pwdd_error=document.getElementById("pwdd_error");

 if(mypwdd=="")
 {
 //pwdd_error.innerHTML="<font color='red'>确认密码不能为空!</font>";
  alert("确认密码不能为空!");
 return false;
 }

else if(document.getElementById("pwdd").value!=document.getElementById("pwd").value)
{
 //pwdd_error.innerHTML="<font color='red'>确认密码与密码不一致!</font>";
  alert("确认密码与密码不一致!");
 return false;

}
else
{
pwdd_error.innerHTML="<font color='red'>√</font>";
return true;

}
}

//检查提交
function regist()
{
 var email_err=document.getElementById('emai_error').innerHTML;
      var pwd_err=document.getElementById('pwd_error').innerHTML;
      var pwdd_err=document.getElementById('pwdd_error').innerHTML;

var yx=document.getElementById("eml").value;
var mima=document.getElementById("pwd").value;
var mmima=document.getElementById("pwdd").value;


//判断错误信息全部为空并且文本框全部不为空
if((yx!=""&&mima!=""&&mmima!="")&&(email_err==""&&pwd_err==""&&pwdd_err==""))
{
alert("恭喜您,注册成功!");
}
else 
{
alert ("注册失败,请按页面的提示认真填写,谢谢!");
      
}

}

</script>
</head>

<body>
<div class="denglu">
<h1>注册模块</h1>

<div>
<span class="email">邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:</span>
<input name="yx" class="email_txt" id="eml" type="text" width="100"  onblur="checkemail()" />
<span id="emai_error" class="after_input">请输入邮箱,格式:xiaoniu@qq.com</span>
</div>
<div>
<span class="email">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码:</span>
<input class="email_txt" type="password" width="100" id="pwd" onblur="checkpwd()" />
<span id="pwd_error" class="after_input">请输入密码</span>
</div>
<div>
<span class="email">确认密码:</span>
<input class="email_txt" type="password" id="pwdd" width="100" onblur="checkpwdd()" />
<span id="pwdd_error" class="after_input">再次输入密码</span>
</div>
<div id="btn">
<input class="sbmit" type="button" value="提交" onclick="regist()" />
</div>

</div>
</body>
</html>



[解决办法]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>登录</title>
    <link href="style/style2.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="denglu">
    <h1>注册模块</h1>
    <div>
        <span class="email">邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:</span>
        <input name="yx" class="email_txt" id="eml" type="text" width="100" />
        <span id="emai_error" class="after_input">请输入邮箱,格式:xiaoniu@qq.com</span>
    </div>
    <div>
        <span class="email">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码:</span>
        <input class="email_txt" type="password" width="100" id="pwd" />
        <span id="pwd_error" class="after_input">请输入密码</span>
    </div>
    <div>
        <span class="email">确认密码:</span>
        <input class="email_txt" type="password" id="pwdd" width="100" />
        <span id="pwdd_error" class="after_input">再次输入密码</span>


    </div>
    <div id="btn">
        <input class="sbmit" type="button" value="提交" onclick="regist()" />
    </div>
</div>
<script type="text/javascript">
    function regist(){
        var eml=document.getElementById("eml");
        var pwd=document.getElementById("pwd");
        var pwdd=document.getElementById("pwdd");
        var reg=/^([a-zA-Z0-9]+[_
[解决办法]
\_
[解决办法]
\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_
[解决办法]
\_
[解决办法]
\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
        if(eml.value==""){
            alert("邮箱不能为空!");
            eml.focus();
        }else if(!reg.test(eml.value)){
            alert("邮箱不正确!");
            eml.focus();
        }else if(pwd.value==""){
            alert("密码不能为空!");
            pwd.focus();
        }else if(pwd.value.length<6
[解决办法]
pwd.value.length>16){
            alert("密码至少应为6位到16位!");
            pwd.focus();
        }else if(pwd.value!=pwdd.value){
            alert("确认密码与密码不一致!");
            pwdd.focus();
        }else{
            alert("恭喜您,注册成功!");
            //应该发送ajax注册并返回结果判断
        }
    }
</script>
</body>
</html>


[解决办法]
if(myemail.indexOf("@")==-1
[解决办法]
myemail.indexOf(".")==-1
[解决办法]
(myemail.indexOf("@")>myemail.indexOf(".")))             {                 //mesg_error.innerHTML="<font color='red'></font>";                 alert("email格式不正确!例:xiaoniu@qq.com");                 document.getElementById("eml").focus();                 return false;             } 




你这应该在alert点击确定事件中调用document.getElementById("eml").focus();才行的

热点排行