zoukankan      html  css  js  c++  java
  • 原生js封装ajax

    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="Generator" content="EditPlus®">
    <meta name="Author" content="">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <title>AJAX</title>
    </head>
    <body>
    
    <script type="text/javascript">
    function Ajax(parameter){
    
    var xhr=null;
    var message=null;
    var newurl=null;
    var method=parameter.method=="post"?"post":"get";
    var url=parameter.url;
    var sync=parameter.sync==true?true:false;
    var success=parameter.success;
    var dataType=parameter.dataType;
    //创建XML对象
    if(window.XMLHttpRequest){
    xhr=new XMLHttpRequest();//标准浏览器
    }
    else if(window.ActiveXObject){
    xhr=new ActiveXObject("Microsoft.XMLHTTP");//IE
    }
    
    if(method=="post"){
    message=url.substring(url.indexOf("?")+1,url.length);//获取?之后的内容(不包括?)
    newurl=url.substring(0,url.indexOf("?"));//获取?之前的内容(不包括?)
    xhr.open(method,newurl,sync);//准备发送请求(配置参数),还没发送
    xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//post提交方式不像get提交方式是默认的,post方式你需要告诉浏览器你使用post提交方式,所以就需要这个请求头
    xhr.send(message);//发送请求
    }
    
    else if(method=="get"){
    xhr.open(method,url,isNsychronous);
    xhr.send(message);//这里面的null 有的老版本浏览器得放一个null兼容处理吧算是
    }
    
    xhr.onreadystatechange=function()
    {
    if(xhr.readyState==4){
    
    if(xhr.status==200){
    var data=dataType=='xml'?xhr.responseXML:xhr.responseText;
    success &&success(data);//成功返回数据的时候调用这个函数
    }
    else{
    alert("出错了,帅气喆");//失败的时候也可以调用函数 看你需求啦
    }
    }
    }
    
    }
    
    var parameter={
    method:"post"
    ,url:"test.php?username=admin&password=1234",
    sync:true,
    success:function(data){
    console.log(data);
    },
    dataType:"json"
    };
    Ajax(parameter);
    
    </script>
    </body>
    </html>

     

  • 相关阅读:
    Python3.7.1学习(六)RabbitMQ在Windows环境下的安装
    使用jmeter进行简单的压测
    python中mock的使用
    python-shutil模块
    python-常用模块之os、sys
    python-冒泡排序
    python-正则基础
    python-二维数组实现90度旋转
    python-使用递归实现二分法
    python-递归的实现
  • 原文地址:https://www.cnblogs.com/liveoutfun/p/8807427.html
Copyright © 2011-2022 走看看