js 驗證使用者名稱和密碼是否為空

姜興琪發表於2015-02-02
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>My JSP 'userValidate.jsp' starting page</title>
    
     <script type="text/javascript">
        function checkUserName(obj){
            var username = obj;
        	var checkUserNameResult = document.getElementById("checkUserNameResult");  
            if(username.trim().length==0){
                  checkUserNameResult.innerHTML = "使用者名稱不能為空";  
                  obj.focus();
            }else{
            	 checkUserNameResult.innerHTML = "";  
            }
        }
    </script>

    <script type="text/javascript">
        function checkPassword(obj){
            var password = obj;
			var checkPasswordResult = document.getElementById("checkPasswordResult"); 
            if(password.trim().length==0){
                checkPasswordResult.innerHTML = "密碼不能為空";  
                obj.focus();
            }else{
            	 checkPasswordResult.innerHTML = "";  
            }
        }

    </script>

  </head>

  <body>

  

  <table>
      <tr>
      	<td>使用者名稱:</td>
    	<td><input type="text" name="username"  onblur="checkUserName(this.value);" /></td>
		<td><span id="checkUserNameResult" style="color: red "></span>  </td>
    </tr>

    <tr>

    <td>密  碼:</td>
    <td><input type="password" name="password" onblur="checkPassword(this.value);"/>
	<td><span id="checkPasswordResult" style="color: red "></span></td>
 
    </tr>

    <tr><td><input type="submit" value="提交" ></td></tr>

    </table>


  </body>

</html>

相關文章