jquery实现页面局部刷新

转载 2015年11月19日 12:17:00

http://evan0625.iteye.com/blog/617004

后台管理中总是使用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. <%@ page language="java" contentType="text/html; charset=utf-8" %>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
  2. <html>  
  3.     <head>  
  4.         <script type="text/javascript" src="js/jquery.js"></script>  
  5.         <script type="text/javascript">   
  6.         function getOtherMessage(){   
  7.             $.ajax({   
  8.                 type:"post",     
  9.                 url:"${pageContext.request.contextPath}/getOtherMessage.do",   
  10.                 success:function(msg){   
  11.                     $("#view").html(msg);   
  12.                 },   
  13.                 error:function(){   
  14.                     alert("wrong");   
  15.                 }   
  16.             });   
  17.        }   
  18.   </script>  
  19.     </head>  
  20.     <body>  
  21.         <input type="button" value="修改" onclick="getOtherMessage();" />  
  22.         <div id="view">  
  23.             456  
  24.         </div>  
  25.     </body>  
  26. </html>  

举报

相关文章推荐

(局部刷新)jquery.ajax提交并实现单个div刷新

web开发中我们经常会遇到局部刷新页面的需求,以前我经常使用ajax和iframe实现局部刷新,后来做政府的项目,对页面的样式要求比较多,发现使用iframe控制样式什么的很麻烦,所以就采用了新的办法...

jquery ajax配合SpringMVC实现局部刷新DIV

feedback.jsp: <% String path = request.getContextPath(); String basePath = request.getScheme()...

我是如何成为一名python大咖的?

人生苦短,都说必须python,那么我分享下我是如何从小白成为Python资深开发者的吧。2014年我大学刚毕业..

(局部刷新)jquery.ajax提交并实现单个div刷新

web开发中我们经常会遇到局部刷新页面的需求,以前我经常使用ajax和iframe实现局部刷新,后来做政府的项目,对页面的样式要求比较多,发现使用iframe控制样式什么的很麻烦,所以就采用了新的办法...

jquery实现页面局部刷新

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

jquery实现页面局部刷新

http://evan0625.iteye.com/blog/617004 后台管理中总是使用frameset进行分成部分进行管理,但是感觉很不好用,尤其是页面间调转还要判断window.par...

jQuery实现AJAX定时刷新局部页面实例

jQuery实现AJAX定时刷新局部页面实例

js或jquery实现页面打印(局部打印)

js或jquery实现页面打印(局部打印) 1、js实现(可实现局部打印) js打印 .noprint{display : none } 不需要打...

jquery实现的Ajax局部刷新

本篇文章通过两种方法实例讲解ajax定时刷新局部页面,当然方法有很多种,也可以不使用ajax来刷新页面,可以使用jquery中的append来给指定内容加东西,但是都不太实用,最实用的方法还是ajax...
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)