程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 網頁編程 >> JSP編程 >> 關於JSP >> 登陸界面(jsp)客戶端驗證

登陸界面(jsp)客戶端驗證

編輯:關於JSP

[html] 
<pre class="html" name="code">第二步:通過servlet處理</pre><pre class="html" name="code"> </pre><pre class="html" name="code"> </pre><pre class="html" name="code">import java.io.IOException; 
import java.io.PrintWriter; 
import java.util.ArrayList; 
import java.util.List; 
 
import javax.servlet.ServletException; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 
 
 
public class validateServlet extends HttpServlet { 
 
    public void doGet(HttpServletRequest req, HttpServletResponse resp) 
            throws ServletException, IOException { 
            //獲得用戶的信息 
        String username=req.getParameter("username"); 
        String password=req.getParameter("password"); 
        String repassword=req.getParameter("repassword"); 
        String shuoming=req.getParameter("shuoming");//說明 
        String []sex=req.getParameterValues("sex");//獲得性別 
        String []aihao=req.getParameterValues("aihao");//獲得興趣 
        String []add=req.getParameterValues("add");//獲得地址 
         
 
         
        //String repassword=req.getParameter("repassword"); 
        //String repassword=req.getParameter("repassword"); 
         
        List<String> list=new ArrayList<String>(); 
        List<String> xingqu=new ArrayList<String>(); 
        if (null=="username"||"".equals(username)) 
        { 
            list.add("there can't be a blank!");             
        } 
        if (password==null||password.length()<6||password.length()>10) 
        { 
            list.add(" the password's length must Between6 and 10 !"); 
        } 
        if (repassword==null||repassword.length()<6||repassword.length()>10) 
        { 
            list.add(" the password's length must Between 6 and 10!"); 
        } 
        if (password!=null&&repassword!=null&&!password.equals(repassword)) 
        { 
            list.add("the two password isn't the same!"); 
             
        } 
         
        if (list.isEmpty()) 
        {  
            req.setAttribute("username",username); 
            req.setAttribute("password",password); 
            req.setAttribute("repassword",repassword); 
            req.setAttribute("shuoming",shuoming);//說明 
            for(int i=0;i<sex.length;i++)//性別 
            req.setAttribute("sex",sex[i]); 
            //興趣 
            for(int i=0;i<aihao.length;i++) 
            { 
                xingqu.add(aihao[i]); 
            } 
            req.setAttribute("aihao",xingqu+" "); 
            //地址 
            for(int i=0;i<add.length;i++) 
                req.setAttribute("add",add[i]); 
            //說明 
            req.getRequestDispatcher("success.jsp").forward(req,resp); 
             
        } 
        else 
        { 
            req.setAttribute("list",list); 
            req.getRequestDispatcher("unsuccess.jsp").forward(req,resp); 
        } 
         
         
     
    } 
 
     

</pre><br> 
最近在學習jsp先寫了個登陸界面的例子 
<pre></pre> 
<pre class="html" name="code">第一步:</pre><pre class="html" name="code"> </pre><pre class="html" name="code"><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<html> 
    <head> 
        <title> 登錄界面 </title> 
        <%--客戶端驗證服務器端驗證未啟動 --%> 
        <script type="text/javascript"> 
          function validate() 
            { 
            //判斷姓名 
                var username=document.getElementById("username1"); 
                if (username.value.length==0) 
                 { 
                 alert("用戶名不能為空!"); 
                 return false; 
                 } 
            //判斷密碼  
                var password=document.getElementById("password1"); 
                var repassword=document.getElementById("repassword1"); 
                  
                if (password.value.length<6||password.value.length>10) 
                { 
                alert("密碼長度不能少於六位超過10位!"); 
                return false; 
                } 
                if (repassword.value.length<6||repassword.value.length>10) 
                { 
                alert("密碼長度不能少於六位超過10位!"); 
                return false; 
                } 
                if (password.value != repassword.value) 
                { 
                alert("兩次密碼不相同!"); 
                return false; 
                } 
                //判斷性別 
                var f=document.getElementById("f"); 
                var m=document.getElementById("m"); 
                if (!f.checked&&!m.checked) 
                { 
                alert("性別沒選擇!"); 
                return false; 
                } 
                //判斷興趣選項 
                var aihao=document.getElementsByName("aihao"); 
                var m=0; 
                for ( var i=0;i<aihao.length;i++) 
                { 
                    if (aihao[i].checked) 
                    { 
                      m++; 
                    } 
                 
                } 
                if (m<2) 
                { 
                    alert("興趣必須多於兩個!"); 
                    return false; 
                } 
                //判斷說明是否為空 
                var txtValue=document.getElementById("txtTest").value; 
                if (txtValue.length<10) 
                { 
                    alert("說明長度不能少於十個字母!"); 
                    return false; 
                 
                } 
                 
     
                 
                return true; 
                 
            } 
           
     
 
        </script> 
         
    </head> 
    <body> 
       
             
            <form onsubmit="return validate();"  action="validateServlet" > 
             
            <%//服務器端驗證:<form action="validateServlet"  > %> 
             
                <table> 
                    <tr> 
                        <td >用戶登錄:</td> 
                    </tr> 
                     
                    <tr> 
                        <td ></td> 
                    </tr> 
                    <tr> 
                        <td>用戶名:</td> 
                        <td><input type="text" name="username" id="username1"></td> 
                    </tr> 
                    <tr> 
                        <td>密   碼:</td> 
                        <td><input type="password" name="password" id="password1"></td> 
                    </tr> 
                    <tr> 
                        <td>重新輸入密碼:</td> 
                        <td><input type="password" name="repassword" id="repassword1"></td> 
                    </tr> 
                    <tr> 
                        <td>性   別:</td> 
                        <td>男:<input type="radio" name="sex"  value="female" id="f" ></td> 
                        <td>女:<input type="radio" name="sex" id="male"></td> 
                     
                    </tr> 
                    <tr> 
                        <td>興   趣:</td> 
                        <td>籃球:<input type="checkbox" name="aihao" value="basketball"></td> 
                        <td>足球:<input type="checkbox"" name="aihao" value="football" ></td> 
                        <td>聽歌:<input type="checkbox"" name="aihao" value="music"></td> 
                        <td>書法:<input type="checkbox"" name="aihao" value="writing"></td> 
                     
                    </tr> 
                    <tr> 
                        <td>地   址:</td> 
                        <td><select name="add" size="1"> 
                            <option value="shanghai" selected>上海 
                            <option value="yantai" >煙台 
                            <option value="beijing" >北京 
                         
                            </select></td> 
                    </tr> 
                    <tr> 
                        <td>說   明:</td> 
                        <td><textarea name="shuoming" clos="20" rows="5" id="txtTest"></textarea></td> 
                         
                     
                    </tr> 
             
                    <tr> 
                        <td><input type="submit" value="提交" ></td> 
                        <td><input type="reset" value="重置"></td> 
                    </tr> 
                 </table>  
                 
                 
                 
                 
             
              </form> 
             
            <a href="http://www.baidu.com">百度</a> 
             
             
             
             
             
             
  </body> 
</html></pre><pre class="html" name="code"> </pre><pre class="html" name="code">登陸成功頁面:</pre><pre class="html" name="code"><pre class="html" name="code"><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
 
<html> 
  <head> 
    
    <title>成功登陸頁面</title> 
     
     
  </head> 
   
  <body> 
     
    <%= "個人信息:"+"<br>" +"<br>"+"<br>"%> 
    <%= "姓名: "+request.getAttribute("username")+"<br>" %> 
    <%= "密碼: "+request.getAttribute("password")+"<br>" %> 
    <%= "性別: "+request.getAttribute("sex")+"<br>" %> 
    <%= "興趣: "+request.getAttribute("aihao")+"<br>" %> 
    <%= "地址: "+request.getAttribute("add") +"<br>"%> 
    <%= "說明 : "+request.getAttribute("shuoming")+"<br>" %> 
     
     
     
    
     
     
  </body> 
</html> 
</pre><br> 
<pre></pre> 
<pre class="html" name="code"> </pre><pre class="html" name="code"> </pre><pre class="html" name="code"> </pre><br> 
 
</pre> 
作者:superlele123

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved