迷失的風
          

          就這樣活著
          

          

          

          隨筆 - 1, 文章 - 1, 評論 - 1, 引用 - 0
          

          


          		
	
          

          

          
	
          
		
			
          
				數據加載中……
			
          
		          		
		
			
          
				
					
	
          
		
          
			Ajax做的小例子
		
          
		
          
		學習Ajax好多天了，終于做出一個小例子。
          
環境
          
eclipse3.2
          
tomcat6.0
          
jdk1.5
          
下面簡單介紹下關于Ajax的主要實現部分
          

          

          index.jsp
          
          <%@ page contentType="text/html; charset=gb2312" language="java"
          
import          ="java.sql.*" errorPage=""          %>
          
          <!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=gb2312" />
          
          <title>用戶注冊</title>
          
          <style type="text/css">
          
<!--
          
.STYLE1           {
          
font-family          : "新宋體";
          
font-size          : 18px;
          
font-weight          : bold;
          
          }
          
-->
          
          </style>
          
          <script src="prototype.js" type="text/javascript"></script>
          
          <script src="validation_cn.js" type="text/javascript"></script>
          
          <link rel="stylesheet" type="text/css" href="style_min.css"/>
          
          <script language="JavaScript" type="text/javascript">
          
              var request = false;
          
              try{
          
     request           = new XMLHttpRequest();
          
    }          catch(microsoftIE){
          
               try{
          
      request           = new ActiveXObject("Msxml2.XMLHTTP");
          
     }          catch(microsoftOldIE){
          
                try{
          
       request           = new ActiveXObject("Microsoft.XMLHTTP");
          
      }          catch(failed){
          
       request           = false;
          
      }
          
     }
          
    }
          
              if(!request){
          
     alert(          "初始化XMLHttpRequest對象失敗");
          
    }
          
              function sendUsername(){
          
               var username = document.getElementById("username").value;
          
               if(username!=null && username!=""){
          
                var url = "/MeetingAction.do?mode=isexist&username="+escape(username);
          
      request.open(          "get",url,true);
          
      request.onreadystatechange          =updatepage;
          
      request.send(          null);
          
     }
          
    }
          
              function updatepage(){
          
               if(request.readyState==4){
          
                if(request.status==200){
          
       document.getElementById(          "reusername").innerHTML = request.responseText;
          
                 //document.getDocumentById("reusername").innerText = request.responseText;
          
                }          else if(request.status==404){
          
       alert(          "找不到頁面！");
          
      }          else{
          
       alert(          "錯誤代碼:"+request.status);
          
      }
          
     }
          
    }
          
              function clearMessage(){
          
     document.getElementById(          "reusername").innerHTML = "";
          
    }
          
              </script>
          
          </head>
          
          <body>
          
          <form id="form1" name="form1" method="post" action="/MeetingAction.do?mode=insertuser">
          
          <div align="center">
          
          <p class="STYLE1">新用戶注冊</p>
          
          <table width="339" height="197" border="1" bgcolor="#FFCCFF">
          
          <tr>
          
            <td>用戶名  <input type="text" name="username"
          
   onblur          ="sendUsername()" onfocus="clearMessage()" /></td>
          
            <td width="40%" id="reusername"></td>
          
          </tr>
          
          <tr>
          
            <td>密 碼  <input type="password" class='required equals-$otherInputId' name="password1" /> </td>
          
          </tr>
          
          <tr>
          
            <td>確 認  <input type="password" class='required equals-$otherInputId' name="password2" /> </td>
          
          </tr>
          
          <tr>
          
            <td height="34">郵 箱 <input type="text" class='required validate-email'
          
   name          ="email" /></td>
          
          </tr>
          
          <tr>
          
            <td>
          
            <div align="center"><input type="submit" name="Submit"
          
   value          ="提交" /></div>
          
            </td>
          
          </tr>
          
          </table>
          
          </div>
          
          </form>
          
          </body>
          
          </html>
          

          

          
在index.jsp中  var url = "/MeetingAction.do?mode=isexist&username="+escape(username);
          
這個請求URL是查詢用戶輸入的用戶名在數據庫里面是否存在；
          
在action里面這樣
          

          String username = request.getParameter("username");//從index.jsp里面得到用戶輸入的用戶名
          
             Boolean exist = this.getIMeetingService().isExist(username);//執行SQL語句
          
             request.setAttribute("exist", exist);
          

          
SQL語句為select count(*) from userinf where username in(?)
          

          
exist.jsp
          

          

          <%@ page language="java" pageEncoding="UTF-8"%>
          
          <link rel="stylesheet" type="text/css" href="style_min.css"/>
          
          <%
          
          Boolean exist = (Boolean)request.getAttribute("exist");
          
          //System.out.println("username:"+username);
          
          if(exist){
          
  out.println(          "<font color='red'>用戶名已經注冊</font>");
          
}          else{
          
  out.println(          "<font color='green'>用戶名可以用</font>");
          
}
          
          %>
          

          

          
通過action處理后返回到exist.jsp來展現具體內容。

		
          
		
          
			posted on 2008-03-20 09:12 迷失的風 閱讀(138) 評論(0)  編輯  收藏  
		
          
	
          
	
	


	


          
	    
    




          





          


          

	
          
		
          
				
		
	
		
          
		
		
          只有注冊用戶登錄后才能發表評論。
          
		
          
			
		
          
			
		
          
		
		
          
		


          

		          		
		
          
		
          			
		
		
		
		
          
		
          
		
		
          
		
          
			網站導航:
		
		
          
		
          
			
		
          	
		
          
			 
		
          
		
          
			
		
          
		
          
			
				
		
          		
	
          	

          



          

				
			
          
		          		
	
          
	
          
		
			

		
	
          

          


    







          
        
	




主站蜘蛛池模板：
元阳县|
鹤庆县|
共和县|
浮梁县|
娄烦县|
常山县|
江城|
西乌珠穆沁旗|
北京市|
繁昌县|
水城县|
定边县|
潼关县|
乌鲁木齐县|
民权县|
洪湖市|
峡江县|
扎鲁特旗|
特克斯县|
灵武市|
通海县|
东平县|
青田县|
吉木乃县|
西和县|
平舆县|
新闻|
津市市|
赤峰市|
金沙县|
新昌县|
时尚|
双鸭山市|
通渭县|
甘孜|
休宁县|
焦作市|
潼南县|
通辽市|
南皮县|
青州市|