zoukankan      html  css  js  c++  java

  • jquery实现页面局部刷新

    后台管理中总是使用frameset进行分成部分进行管理，但是感觉很不好用，尤其是页面间调转还要判断window.parent，太令我费神了，于是学习使用XMLHttpRequest进行页面局部刷新。代码如下：

    Java代码  收藏代码
    1. <html>  
    2.     <head>  
    3.         <script type="text/javascript">   
    4.             window.onload = function(){   
    5.             document.getElementById("email").onblur = function(){   
    6.                 if(window.XMLHttpRequest){   
    7.                     http_request = new XMLHttpRequest();   
    8.                     if(http_request.overrideMimeType){  
    9.                     http_request.overrideMimeType("text/xml");   
    10.                     }   
    11.                 }else if(window.ActiveXObject){   
    12.                     try{   
    13.                         http_request = new ActiveXObject("Msxml2.XMLHTTP");   
    14.                     }catch(e){   
    15.                         try{      
    16.                             http_request = new ActiveXObject("Microsoft.XMLHTTP");   
    17.                         }catch(e){}   
    18.                     }   
    19.                 }   
    20.                 if(!http_request){   
    21.                     window.alert("不能创建XMLHttpRequest对象实例！");   
    22.                     return false;   
    23.                 }   
    24.                 http_request.onreadystatechange = function(){   
    25.                     if(http_request.readyState == 4 &&   
    26.                         http_request.status == 200) {   
    27.                         document.getElementById("emailTip").innerHTML   
    28.                         =http_request.responseText;   
    29.                     }   
    30.                 };   
    31.                 http_request.open("GET", "email.jsp?email="+this.value, true);   
    32.                 http_request.send(null);   
    33.                 }   
    34.             }   
    35.   </script>  
    36.     </head>  
    37.     <body>  
    38.         <input type="button" value="修改" onclick="getOtherMessage();" />  
    39.         <input type="text" id="email" />  
    40.         <span id="emailTip"></span>  
    41.         <div id="view">  
    42.             456  
    43.         </div>  
    44.     </body>  
    45. </html>  

    后经高手提醒，可以使用ajax技术来写，使用jquery很简单，示例如下：

    Java代码  收藏代码
    1. <html>  
    2.     <head>  
    3.         <script type="text/javascript" src="js/jquery.js"></script>  
    4.         <script type="text/javascript">   
    5.         function getOtherMessage(){   
    6.             $.ajax({   
    7.                 type:"post",     
    8.                 url:"${pageContext.request.contextPath}/getOtherMessage.do",   
    9.                 success:function(msg){   
    10.                     $("#view").html(msg);   
    11.                 },   
    12.                 error:function(){   
    13.                     alert("wrong");   
    14.                 }   
    15.             });   
    16.        }   
    17.   </script>  
    18.     </head>  
    19.     <body>  
    20.         <input type="button" value="修改" onclick="getOtherMessage();" />  
    21.         <div id="view">  
    22.             456  
    23.         </div>  
    24.     </body>  
    25. </html>  
  • 相关阅读:
    HOWTO get multiple value from the same name checkbox elements or radiobution elements
    你家有几台电脑
    *qian翻
    nginx 域名绑定
    linode设置汇总
    how to relize 301 redirect on bottle
    Nginx禁止未在服务器绑定的域名访问
    linode设置汇总
    sogouq免费企邮
    linode设置汇总
  • 原文地址：https://www.cnblogs.com/ranzige/p/3807330.html
Copyright © 2011-2022 走看看