相信自己！
          
				
          
			          		
		
          
	
          

          

          
	
          
		
          
			
 
BlogJava ::
首頁 ::
新隨筆 ::
聯系 ::
聚合
 ::
管理 ::


			
			
				

          
	
          
		
          
			
			
			
				 
				26 
				隨筆 ::
				3 文章
				::
				13 評論
				::
				0 Trackbacks
			
		
          
	
          

          

			          		
		
          
	
          

          


          


          
	
					

          
	
	
	
          
		       改變用戶名的年齡：
          
       年齡的顯示方法如下：
          
                  <td bgcolor="#F2F2F2" align='center'>
          
 <span id="<%=user.getId()%>" style="background:red" onclick="changeToInput(this.id)" value="<%=user.getAge()%>">    <%=user.getAge()%>     </span></td>
          
              changeToInput(this.id)方法如下：
          

          
        

          <script type="text/javascript">
          
                      var req;
          
                      var gID;
          
                      function changeToInput(id) {
          
                          var oNP = document.getElementById(id);
          
                          var value = oNP.value;
          
                oNP.outerHTML           = "<input type='text' id='" + id + "' value='" + value + "' size='5' onblur='change(this.id)'>";
          
                document.getElementById(id).focus();
          
            }
          
            
          
                      function change(id) {
          
                          var oNP = document.getElementById(id);
          
                          var value = oNP.value;
          
                gID           = id;
          
                init();
          
                          var url = "ChangeAge.jsp?id=" + escape(id) + "&age=" + value;
          
                req.open(          "GET", url, true);
          
                req.onreadystatechange           = callback;
          
                req.send(          null);
          
                
          
            }
          
            
          
                      function init() {
          
                          if(window.XMLHttpRequest) {
          
                    req           = new XMLHttpRequest();
          
                }           else if (window.ActiveXObject) {
          
                    req           = new ActiveXObject("Microsoft.XMLHTTP");
          
                }
          
            }
          
            
          
                      function callback() {
          
                          if(4 == req.readyState) {
          
                
          
                              if(200 == req.status) {
          
                
          
                                  var oNP = document.getElementById(gID);
          
                                  var value = oNP.value;
          
                        oNP.outerHTML           = "<span style='background:gray' id='" + gID + "' value='" + value + "' onclick='changeToInput(this.id)'>" + value + "</span>";
          
                    }
          
                }
          
                
          
            }
          
            
          
                  </script>
          
        
          
       ChangAge.jsp頁面代碼如下：
          
            

          <%@ page language="java" import="org.mxg.dao.impl.*, org.mxg.dao.*,java.util.*" pageEncoding="gbk"%>
          
          <%
          
          int id = Integer.parseInt(request.getParameter("id"));
          
          int age = Integer.parseInt(request.getParameter("age"));
          
IUserDAO userDAO           = new UserDAO();
          
userDAO.UpdateAgeById(age,id);          //調用DAO的方法更新年齡
          

          

          

          
response.setContentType(          "text/html;charset=gbk");
          
response.setHeader(          "Cache-Control", "no-store"); //HTTP1.1//阻止瀏覽器存儲內容！
          
          response.setHeader("Pragma", "no-cache"); 
          
response.setDateHeader(          "Expires", 0); %>
          

          

          
    這樣就實現了：在前臺直接用鼠標點擊年齡的文本框就可以直接更改了！
          
     
          
   
          
    
          
             

	
          
	
	
          
		posted on 2007-11-10 17:44 北極雪 閱讀(1381) 評論(1)  編輯  收藏  所屬分類: css 
	
          

          







          
	    
    


          

          
	
          評論
          
		
		
				
          			
					
          
						# re: 無刷新改變數據庫的內容 ajax的簡單應用
							
								2007-11-10 19:54
							
						wukaichun
					
          
					
          
						對Ajax又有了點了解.簡單易懂~`支持(:~`  回復  更多評論
						
          
						  
					
          
				
          
				
          
			

          




          





          


          

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


          

		          		
		
          
		
          			
		
		
		
		
          
		
          
		
		
          
		
          
			網站導航:
		
		
          
		
          
			


		
          	
		
          
			 
		
          
		
          
			
		
          
		
          
			
				
		
          		
	
          	

          



          

				

          




    







          
        
	




主站蜘蛛池模板：
郸城县|
横山县|
浪卡子县|
防城港市|
京山县|
三原县|
化隆|
泰州市|
临澧县|
日喀则市|
巴彦县|
西峡县|
湖南省|
安阳市|
武平县|
黄浦区|
南陵县|
进贤县|
德州市|
涿州市|
尉犁县|
万盛区|
鹤岗市|
搜索|
乐都县|
札达县|
河源市|
玉树县|
瑞金市|
稻城县|
平阴县|
巴楚县|
北宁市|
濮阳市|
彰化市|
蛟河市|
通州市|
睢宁县|
仙居县|
梨树县|
平顺县|