zoukankan      html  css  js  c++  java
  • javascript-XMLHttpRequest

    JS方法:
     var xmlhttp;//一定注意是写在外面的全局变量,我调了一个上午才发现。
    
     function verify(){
      //使用dom方式获取文本框中的值
      var userName=document.getElementById("userName").value;
      //以下5个步骤即完成ajax应用的5个关键步骤
      //1. 创建XMLHttpRequest对象(最关键&复杂的一步)
      //需要针对IE和其他类型的浏览器建立这个对象的不同方式写不同代码
      if(window.XMLHttpRequest){
       xmlhttp=new XMLHttpRequest();//针对mozillar,firefox,opera,safari,ie7,ie8
       //针对某些特定版本的mozillar浏览器的bug(主要是调用回调函数时会有问题)进行修正(这一步是保证脚本的健壮性)
       if(xmlhttp.overrideMimeType){
        xmlhttp.overrideMimeType("text/xml");
       }
      }else if(window.ActionXObject){
       //(老师语)为什么这个放在第二个if语句里呢?
       //(1)针对的对象范围太窄
       //(2)自身的缺陷或者说原理已被一些人摸透了,有人利用ActionXObject干了不少坏事(?)所以会被一些有经验的用户直接禁掉
       //针对ie6,ie5.5,ie5
       //两个可以创建XMLHttpRequest对象的控件名称,保存在一个js数组中,排在前面的较新
       varactivexName=["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
       for(var i=0; i<activexName.length; i++){
        try{
         xmlhttp=new ActionXObject(activexName[i]);
         break;
        }catch(e){
        }
       }
       
      }
      //确认XMLHttpRequest对象创建成功(保证脚本的完整性,指开发的时候)
      if(!xmlhttp){
       alert("XMLHttpRequest对象创建视频!!");
       return;
      }else{
       alert(xmlhttp);
      }
      //2. 注册回调函数
      //只用函数名,不加括号,是因为该句只是把回调函数名注册给xmlhttp.onreadystatechange
      //如果加了括号,则是调用函数,然后把该函数的返回值注册了。
      //xmlhttp状态每次改变都会重新调用callback方法
      xmlhttp.onreadystatechange=callback;
      //3. 利用open方法设置与服务器的连接信息
      xmlhttp.open("GET","AjaxServer?name="+userName,true);//Post方法请自行google百度
    //还可以用Post方法进行传送,//xmlhttp.open(“POST”,”AjaxServer”,true)
    //xmlhttp.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”)
      //4. 发送数据,开始和服务端进行交互
      //之所以send(null)是因为第3步中,数据信息都在url里了,如果是Post方法,send(具体数据)
    //如xmlhttp.send(“name”+userName);
      //第3步中最后一个参数如果false,则运行到该句中止,一直等到数据返回;为true则代码继续运行
      xmlhttp.send(null);
     }
     function callback(){
       //5. 接收响应数据(在回调函数中针对不同响应状态进行处理)
       //判断对象的状态是交互完成的
      if(xmlhttp.readyState==4){
    //0=未初始化,对象以创建,未调用open
    //1=open方法调用成功,send方法未调用
    //2=send方法已调用,未开始接收数据
    //3=正在接收数据,HTTP响应头信息已经接收,数据尚未接收完成
    //4=完成
       //判断http的交互是否成功
       if(xmlhttp.status==200){//关于xmlhttp.status请自行google百度
        //获取服务器端返回数据
        varresponseText=xmlhttp.responseText; //纯文本方式,关于其他方式请自行google百度
        //将数据显示在页面上
        //(1)通过Dom方式找到div标签对应的元素节点
        vardivNode=document.getElementById("result");
        //(2)设置元素节点中的html内容
        divfNode.innerHTML=responseText;
       }else{//出错信息}
      }
     }
    
    //这里有一个问题 就是 xmlhttp.open("GET","AjaxServer?name="+userName,true); 中的 AjaxServer 对于IE来说 
    //有些问题,交不到 想要的Servlet中去时,可以在后面加 ?type=nihao 什么的
    //例:xmlhttp.open("GET","/myBoKe/PingLunController",true); 这个不能到PingLunController.java中,调到了主要的servlet中去了。 可能是我用了Iframe标签的 应该注意一下
    //  xmlhttp.open("GET","/myBoKe/PingLunController?type=in hao",true); 这样就可以了,很奇怪的
     
  • 相关阅读:
    checked、disabled在原生、jquery、vue下不同写法
    大白话理解闭包及相关笔试题
    reduce多种方法计算数组中某个值的出现次数
    js原生_获取url键值对
    弹窗和遮罩层的显示隐藏及空白区域关闭
    tab选项卡切换(js原生、jQuery )
    大白话理解this
    js---通过arguments来获取指定参数
    js-字符串方法
    登录linux,输入ls显示anaconda-ks.cfg cobbler.ks ....., 原因在于root@ ~ / 区别
  • 原文地址:https://www.cnblogs.com/shaoshao/p/3396122.html
Copyright © 2011-2022 走看看