`
jia5286112
  • 浏览: 11501 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

Ajax同一页面同时执行多个XMLHTTP (2)

    博客分类:
  • AJAX
阅读更多
2.第一次执行完成后执行第二次请求,可避免第一个请求还没执行完就被覆盖
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AJAX同一页面加载多个测试</title>
<script language="JavaScript">
var xmlHttp;
function createXMLHttpRequest() {
     if (window.XMLHttpRequest){               //FireFox
            xmlHttp = new XMLHttpRequest();
          }
     else if(window.ActiveXObject){
           try {
           xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   //IE6
          }catch(e){
           try {
           xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");      //IE7
          }catch (e){
           alert('对不起,本页面只支持IE6,IE7,FireFox');
          }
      }
   }
}
function startRequest(tn,what) {
    createXMLHttpRequest();
    xmlHttp.onreadystatechange = function(){handleStateChange(what);};
    xmlHttp.open("GET", "test2.jsp?tn="+tn, true);
    xmlHttp.send(null);
}
function handleStateChange(what) {
    if(xmlHttp.readyState == 4) {
        if(xmlHttp.status == 200) {
            var result = xmlHttp.responseText;
            document.getElementById(what).innerHTML = result;
            if(what=='msg1'){
            alert('第二次');
                startRequest('sort_jiaoyi','msg2');
            }

        }
    }
    else {
        document.getElementById(what).innerHTML = "正在载入...";
    }
}
</script>
</head>
<body onLoad="startRequest('sort_fangwu','msg1');">
<table>
<tr><td>
<div id="msg1" style="width:300px; background:#0099FF"></div>
</td></tr>
<tr><td>
<div id="msg2" style="width:300px; background:#66FF33"></div>
</td></tr>
</table>
</body>
</html>

有更好方法没哈??
分享到:
评论

相关推荐

    防止一个用户登录多次的方法

    在JavaScript中,创建一个XMLHTTP实例,当用户关闭页面时发送注销请求,然后关闭当前窗口。这种方法减少了对浏览器特定行为的依赖,通常能提供更一致的结果。 这两种方法的主要目标都是在用户未通过正常注销流程...

    JavaScript 之Ajax详解

    xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } ``` **处理请求状态** XMLHttpRequest对象有一个`readyState`...

    新手练习 Ajax请求封装进JavaScript类

    然而,如果你希望支持并发请求,可以创建多个`AjaxRequest`实例,每个实例对应一个独立的请求。例如: ```javascript const request1 = new AjaxRequest('url1'); const request2 = new AjaxRequest('url2'); ...

    AJAX示例

    Ajax能够在不重新加载整个页面的情况下更新部分网页内容,极大地提升了网页的响应速度。 #### 二、基础知识 1. **概念**:Ajax是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它利用了JavaScript...

    ajax 基础教程

    总结来说,AJAX通过XMLHttpRequest对象实现了网页的异步更新,提高了用户体验,而无需刷新整个页面。通过理解这些基础知识,你可以开始构建自己的AJAX应用程序。不过,实际开发中还需要考虑更多的细节,比如错误处理...

    浅谈JS原生Ajax,GET和POST

    GET请求常用于获取服务器上的资源,它是无状态且幂等的,意味着多次执行同一请求将产生相同的结果。在示例代码中,`getLabelsGet`函数演示了如何创建GET请求: 1. **创建XMLHttpRequest对象**:这是所有AJAX操作的...

    原生 JS Ajax,GET和POST 请求实例代码

    原生JavaScript中的Ajax技术是实现页面无刷新通信的关键,它允许网页在后台与服务器进行数据交换,无需重新加载整个页面。Ajax(Asynchronous JavaScript and XML)虽然名字中有XML,但现代实践中更多的是使用JSON...

    原生JS简单实现ajax的方法示例

    3. 异步处理:由于AJAX是异步的,因此可能需要处理多个并发请求,确保它们按预期顺序执行。 4. 缓存控制:有时可能需要禁用或启用缓存,可以通过设置HTTP头来实现。 总的来说,原生JavaScript实现AJAX涉及的主要...

    XMLHttpRequest中文参考手册(13)

    如果在多次尝试中获取同一头部信息,可能需要在每次`send`调用后重新调用`getResponseHeader`。此外,由于涉及到跨域安全问题,某些头部信息可能无法通过`getResponseHeader`获取,这取决于服务器的CORS(Cross-...

    《程序天下:JavaScript实例自学手册》光盘源码

    12.14 页面打开的同时打开另外两个窗口 12.15 慢慢变大的窗口 12.16 设置新打开的窗口为活动窗口 12.17 页面随窗口的改变而改变 12.18 幻灯片式弹出窗口 12.19 弹出窗口生成器 12.20 关不掉的警告框 12.21 循环的...

    程序天下:JavaScript实例自学手册

    12.14 页面打开的同时打开另外两个窗口 12.15 慢慢变大的窗口 12.16 设置新打开的窗口为活动窗口 12.17 页面随窗口的改变而改变 12.18 幻灯片式弹出窗口 12.19 弹出窗口生成器 12.20 关不掉的警告框 12.21 循环的...

    Js+Ajax,Get和Post在使用上的区别小结

    - GET请求可被浏览器缓存,且可安全地重复执行,因为其是幂等的,多次请求同一个URL应该得到相同的结果。 - POST请求通常不会被浏览器缓存,也不应被重复提交,因为它可能导致副作用,比如多次购买同一件商品。 4...

    java 面试题搜集

    创建一个新的XMLHttpRequest对象,如`new ActiveXObject("Microsoft.XMLHTTP")`(在旧版IE中)或`new XMLHttpRequest()`(在现代浏览器中)。然后通过`open()`方法指定请求类型(如GET)、URL和是否异步,接着设置回...

    js同源策略详解

    它最早出自Netscape Navigator2.0,其目的是防止某个文档或脚本从多个不同源装载。 这里的同源指的是:同协议,同域名和同端口。 精髓: 它的精髓很简单:它认为自任何站点装载的信赖内容是不安全的。当被浏览器...

    IE、FF、Chrome浏览器中的JS差异介绍

    这导致在编写兼容多浏览器的Ajax请求代码时,必须进行判断和适配: ```javascript var xhr; if (window.ActiveXObject) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } else { xhr = new XMLHttpRequest(); ...

Global site tag (gtag.js) - Google Analytics