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

  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很简单，示例如下：

  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>

jquery实现页面局部刷新的更多相关文章

  1. jquery 实现页面局部刷新ajax做法

    这个方法就多了去了,常见的有以下几种:下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲 ...

  2. jquery的div局部刷新

    jquery的div局部刷新 //div的局部刷新 $(".dl").load(location.href+" .dl"); 全页面的刷新方法 window.l ...

  3. JQuery 实现页面无刷新

    对于JQuery实现页面无刷新的效果,即:应用这个JQuery这个组件,可以实现在页面上加载数据库中的数据信息,但是并没有给用户页面刷新的感觉,这样既可以有效的进行数据交互,也可以不妨碍用户的其他操作 ...

  4. 使用ajax与iframe嵌套实现页面局部刷新

    使用ajax与iframe嵌套实现页面局部刷新.该javascript代码仅供参考,需按自己需要修改.​1. [代码]javascript代码 function cj_start(depname,gr ...

  5. 浅析PHP页面局部刷新功能的实现小结(转)

    转载地址 https://www.jb51.net/article/38901.htm 方法其实挺多的.以前比较常用的是iframe这样来做.现在多了个ajax,所以一般情况下都是用的ajax.第一种 ...

  6. ASP.Net用jQuery ajax实现页面局部刷新

    刚开始的时候使用asp的updatepanel控件实现局部刷新,而且在本地运行正确,但是部署到服务器上就变成整个页面全部刷新了.服务器用的是Windows server2000,本地机子上用的是win ...

  7. HTML页面局部刷新

    /.事件响应刷新:有请求才会刷新 1.通过JS HTML DOM或jQuery获取HTML元素,通过DOM方法或jQuery方法监听页面事件,获取用户请求: 2.通过Ajax将用户请求提交至服务器,服 ...

  8. spring mvc + ajax上传文件，页面局部刷新

    1.点击上传按钮进行如下操作,通过表单名称以及input名称获取相应的值,对于上传的文件,使用.files来获取, 因为包含文件的上传,所以采用FormData的形式来进行数据交互,通过append将 ...

  9. jQuery Pjax – 页面无刷新加载，优化用户体验

    pjax 是 HTML5 pushState 以及 Ajax 两项技术的简称,综合这两个技术可以实现在不刷新页面的情况下载入 HTML 到当前网页,带给你超快速的浏览器体验,而且有固定链接.标题以及后 ...

随机推荐

  1. 用Delphi实现文件关联

      文件关联为我们带来很多的方便.Delphi自带有注册表对象TRegistry,可以通过它取得或改变注册表相关键值的内容. Function GetAssociatedExec(FileExt: S ...

  2. OFBIZ安装

    1. 安装SVN客户端,从Apache OFBiz Source Repository获取OFBIZ下载地址.此处以12.04为例,下载地址为http://svn.apache.org/repos/a ...

  3. windows系统下Python环境的搭建及Selenium的安装

    1.首先访问http://www.python.org/download/去下载最新的python版本: 2.下载安装包,一路安装完毕: 3.为计算机添加安装目录搭到环境变量,如图把python的安装 ...

  4. 部署WAR文件到tomcat

    1.启动tomcat服务 2.在浏览器的地址栏输入地址“http://localhost:8080/manager/html”进入tomcat管理界面. 如果要管理的服务器是在网络中,则将localh ...

  5. 序列for循环语句

    序列for循环语句 序列for循环语句允许重复遍历一组序列,而这组序列可以是任何可以重复遍历的序列,如由begin()和end()函数定义的STL序列.所有的标准容器都可用作这种序列,同时它也同样可以 ...

  6. Office2016 转换零售版为VOL版

    @echo off :ADMIN openfiles >nul >nul ||( echo Set UAC = CreateObject^("Shell.Application& ...

  7. LeetCode(5) － Longest Palindromic Substring

    这道题要求的是给你一个string, 如“adcdabcdcba",要求返回长度最大的回文子字符串.这里有两个条件,一是子字符串,而是回文.用纯暴力搜索的话,需要用到O(n^3)的时间,必然 ...

  8. PySpark调用自定义jar包

    在开发PySpark程序时通常会需要用到Java的对象,而PySpark本身也是建立在Java API之上,通过Py4j来创建JavaSparkContext. 这里有几点是需要注意的 1. Py4j ...

  9. 基于gSOAP使用头文件的C语言版web service开发过程例子

    基于gSOAP使用头文件的C语言版web service开发过程例子 一服务端 1 打开VS2005,创建一个工程,命名为calcServer. 2 添加一个头文件calc.h,编辑内容如下: 1// ...

  10. 一排div自由下落

    function getstyle(obj,attr) { return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[a ...