相信自己！
          
				
          
			          		
		
          
	
          

          

          
	
          
		
          
			
 
BlogJava ::
首頁 ::
新隨筆 ::
聯(lián)系 ::
聚合
 ::
管理 ::


			
			
				

          
	
          
		
          
			
			
			
				 
				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);          //調(diào)用DAO的方法更新年齡
          

          

          

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

          

          
    這樣就實(shí)現(xiàn)了：在前臺直接用鼠標(biāo)點(diǎn)擊年齡的文本框就可以直接更改了！
          
     
          
   
          
    
          
             

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

          







          
	    
    


          

          
	
          評論
          
		
		
				
          			
					
          
						# re: 無刷新改變數(shù)據(jù)庫的內(nèi)容 ajax的簡單應(yīng)用
							
								2007-11-10 19:54
							
						wukaichun
					
          
					
          
						對Ajax又有了點(diǎn)了解.簡單易懂~`支持(:~`  回復(fù)  更多評論
						
          
						  
					
          
				
          
				
          
			

          




          





          


          

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


          

		          		
		
          
		
          			
		
		
		
		
          
		
          
		
		
          
		
          
			網(wǎng)站導(dǎo)航:
		
		
          
		
          
			


		
          	
		
          
			 
		
          
		
          
			
		
          
		
          
			
				
		
          		
	
          	

          



          

				

          




    







          
        
	




主站蜘蛛池模板：
仪征市|
分宜县|
盘山县|
桐城市|
长武县|
麦盖提县|
仙游县|
灵武市|
台湾省|
木兰县|
旅游|
手游|
恩施市|
灌阳县|
黑龙江省|
绥江县|
从化市|
互助|
日照市|
西城区|
慈溪市|
琼结县|
通道|
包头市|
安乡县|
福贡县|
建宁县|
潍坊市|
郸城县|
宜川县|
高邑县|
科尔|
阳原县|
永泰县|
宝山区|
晋州市|
金阳县|
隆回县|
临海市|
徐水县|
郸城县|