web开发中给文本框添加onBlur问题

下面是一段代码：
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<script>
function aaa(){
document.getElementById("aa").src="http://localhost:8080/Sunweb/servlet/AuthServlet";
return false;
}
</script>
<html>
  <head>
    
    <title>My JSP 'Tijiao.jsp' starting page</title>
    
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->  </head>
  
  <body>
  <form action="/Sunweb/servlet/Servlet" method="post" name="form1">
  <table>
  <tr>
  <td>姓名：</td><td><input type="text" name="user" value="Sun"></td> 
  <td><input type="text" name="checkuser" value="<%=request.getAttribute("error1") %>"></td> 
  </tr>
  <tr>
  <td>输入密码：</td><td><input type="password" name="pwd" value="" ></td>  
  </tr>
  <tr>
  <td>确认密码：</td><td><input type="password" name="pwd1" value=""></td>  
  </tr>
  <tr>
  <td>邮箱地址：</td><td><input type="text" name="mail" value="@yahoo.com"></td>  
  </tr>
  <tr><td>验证码图片：</td><td><img border=0 src="/Sunweb/servlet/AuthServlet" id="aa"></td>
  <td><input type="button" name="submit1" value="更换图片" onclick="aaa();"></td>
  </tr>
  <tr><td>输入验证码：</td><td><input type="text" maxlength=4 name="code" value=""></td></tr>
  <tr>
  <td></td><td><input type="submit" name="submit" value="提交"></td>
  </tr>
  </table>
  </form>
  </body>
</html>
我想得到的最终效果是：当光标移到确认密码文本框时，如果输入密码文本框为空，就会出现一个对话框，说：密码不能为空，怎么通过添加onBlur事件来实现这一功能，注意：代码不能作太大改动，必须是在web开发环境下的。那位高手能给我指点迷津，谢谢了！

解决方案 »

  1.   

    onFocus()才是移入事件
    onBlur()是移出啊<input type="text" name="mail" value="@yahoo.com" onfocus="if(this.value==''){alert('老大！你还么添东西呢。');this.focus();}" onblur="if(this.value==''){alert('老大！你还么添东西呢。');this.focus();}">
      

  2.   

    你到底是要用什么事件来控制啊 看得有点昏哦
    我理解的是这样的 当光标到确认确认密码的时候 如果输入密码的文本为空就提示
    function isNotNull(){
      var pass = document.getElementByName("pwd1");
      if(pass.value==""){
         alert("输入密码不能为空！");
         return false;
      }
      return true;
    }
    在输入密码(pwd1)处调用onBlue= isNotNull()
      

  3.   

    我觉得客户端应该从两个方面来控制这个问题：
    第一是当鼠标离开密码框时，即onBlur事件
    第二是Form提交时。
    两个方面同时控制才算是友好的。当然如果只用Form提交也可以，onBlur事件不是必须的。<input type="password" name="pwd1" value="" onblur="return check(this);"> function check(obj){
        if(obj.value == ""){
            //进行你要的处理
            return false;
        }
        return true;
    }对于第二种情况3楼已经谈到了，你可以综合一下。当然，再在服务器端进行一下非空校验才是安全的。
      

  4.   

    function checkPSW1(){
     if(document.form1.pwd.value =="")
     {
    alert("密码不能为空！");
     }
    }
       
    <td>确认密码： </td> <td> <input type="password" name="pwd1" value="" onfocus ="checkPSW1();"> </td>   要想只是在光标在pwd1的时候check，应该用onfocus。而onblur是失去焦点是触发的。
      

  5.   

    代码是，请指教，谢谢了：
    <%@ page language="java" import="java.util.*" pageEncoding="gb2312"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
    <script> 
    function aaa(){ 
    document.getElementById("aa").src="http://localhost:8080/Sunweb/servlet/AuthServlet"; 
    return false; 
    }function isNotNull(){ 
      var pass = document.getElementByName("pwd1"); 
      if(pass.value==""){ 
         alert("输入密码不能为空！"); 
         return false; 
      } 
      return true; 
    } 
     
    </script> 
    <html> 
       <head> 
         
         <title>My JSP 'Tijiao.jsp' starting page </title> 
         
    <meta http-equiv="pragma" content="no-cache"> 
    <meta http-equiv="cache-control" content="no-cache"> 
    <meta http-equiv="expires" content="0">     
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
    <meta http-equiv="description" content="This is my page"> 
    <!-- 
    <link rel="stylesheet" type="text/css" href="styles.css"> 
    -->    </head> 
       
       <body> 
       <form action="/Sunweb/servlet/Servlet" method="post" name="form1"> 
       <table> 
       <tr> 
       <td>姓名： </td> <td> <input type="text" name="user" value="Sun"> </td>  
       <td> <input type="text" name="checkuser" value=" <%=request.getAttribute("error1") %>"> </td>  
       </tr> 
       <tr> 
       <td>输入密码： </td> <td> <input type="password" name="pwd" value="" > </td>   
       </tr> 
       <tr> 
       <td>确认密码： </td> <td> <input type="password" name="pwd1" value="" onBlur= isNotNull()> </td>   
       </tr> 
       <tr> 
       <td>邮箱地址： </td> <td> <input type="text" name="mail" value="@yahoo.com"> </td>   
       </tr> 
       <tr> <td>验证码图片： </td> <td> <img border=0 src="/Sunweb/servlet/AuthServlet" id="aa"> </td> 
       <td> <input type="button" name="submit1" value="更换图片" onclick="aaa();"> </td> 
       </tr> 
       <tr> <td>输入验证码： </td> <td> <input type="text" maxlength=4 name="code" value=""> </td> </tr> 
       <tr> 
       <td> </td> <td> <input type="submit" name="submit" value="提交"> </td> 
       </tr> 
       </table> 
       </form> 
       </body> 
    </html> 
      

  6.   

    代码是，请指教，谢谢了：
    <%@ page language="java" import="java.util.*" pageEncoding="gb2312"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
    <script> 
    function aaa(){ 
    document.getElementById("aa").src="http://localhost:8080/Sunweb/servlet/AuthServlet"; 
    return false; 
    }function isNotNull(){ 
      var pass = document.getElementByName("pwd1"); 
      if(pass.value==""){ 
         alert("输入密码不能为空！"); 
         return false; 
      } 
      return true; 
    } 
     
    </script> 
    <html> 
       <head> 
         
         <title>My JSP 'Tijiao.jsp' starting page </title> 
         
    <meta http-equiv="pragma" content="no-cache"> 
    <meta http-equiv="cache-control" content="no-cache"> 
    <meta http-equiv="expires" content="0">     
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
    <meta http-equiv="description" content="This is my page"> 
    <!-- 
    <link rel="stylesheet" type="text/css" href="styles.css"> 
    -->    </head> 
       
       <body> 
       <form action="/Sunweb/servlet/Servlet" method="post" name="form1"> 
       <table> 
       <tr> 
       <td>姓名： </td> <td> <input type="text" name="user" value="Sun"> </td>  
       <td> <input type="text" name="checkuser" value=" <%=request.getAttribute("error1") %>"> </td>  
       </tr> 
       <tr> 
       <td>输入密码： </td> <td> <input type="password" name="pwd" value="" > </td>   
       </tr> 
       <tr> 
       <td>确认密码： </td> <td> <input type="password" name="pwd1" value="" onBlur= isNotNull()> </td>   
       </tr> 
       <tr> 
       <td>邮箱地址： </td> <td> <input type="text" name="mail" value="@yahoo.com"> </td>   
       </tr> 
       <tr> <td>验证码图片： </td> <td> <img border=0 src="/Sunweb/servlet/AuthServlet" id="aa"> </td> 
       <td> <input type="button" name="submit1" value="更换图片" onclick="aaa();"> </td> 
       </tr> 
       <tr> <td>输入验证码： </td> <td> <input type="text" maxlength=4 name="code" value=""> </td> </tr> 
       <tr> 
       <td> </td> <td> <input type="submit" name="submit" value="提交"> </td> 
       </tr> 
       </table> 
       </form> 
       </body> 
    </html> 
      

  7.   

    问题出在这里
    function isNotNull(){  
      var pass = document.getElementByName("pwd1");  
      if(pass.value==""){  
         alert("输入密码不能为空！");  
         return false;  
      }  
      return true;  
    }  javascript中好象没有getElementByName这个用法,只有getElementsByName，但它是获得一个数组。我们都是用getElementById来获得一下指定名称的元素,尽管你的元素中只name属性。如果你还有什么疑问，不妨在网上搜一下这方面的文章。