zoukankan      html  css  js  c++  java
  • javascript实现原生ajax

    自从javascript有了各种框架之后,比如jquery,使用ajax已经变的相当简单了。但有时候为了追求简洁,可能项目中不需要加载jquery这种庞大的js插件。但又要使用到ajax这种功能该如何办呢?下面和大家分享javascript实现原生ajax的方法。 

    实现ajax之前必须要创建一个 XMLHttpRequest 对象。如果不支持创建该对象的浏览器,则需要创建 ActiveXObject,具体方法如下: 

    var xmlHttp; 
    function createxmlHttpRequest() { 
    if (window.ActiveXObject) { 
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } else if (window.XMLHttpRequest) { 
    xmlHttp=new XMLHttpRequest(); 
    }

    (1)下面使用上面创建的xmlHttp实现最简单的ajax get请求:

    function doGet(url){ 
    // 注意在传参数值的时候最好使用encodeURI处理一下,以防出现乱码 
    createxmlHttpRequest(); 
    xmlHttp.open("GET",url); 
    xmlHttp.send(null); 
    xmlHttp.onreadystatechange = function() { 
    if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) { 
    alert('success'); 
    } else { 
    alert('fail'); 
    } 
    } 
    } 

    (2)使用上面创建的xmlHttp实现最简单的ajax post请求:

    function doPost(url,data){ 
    // 注意在传参数值的时候最好使用encodeURI处理一下,以防出现乱码 
    createxmlHttpRequest(); 
    xmlHttp.open("POST",url); 
    xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 
    xmlHttp.send(data); 
    xmlHttp.onreadystatechange = function() { 
    if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) { 
    alert('success'); 
    } else { 
    alert('fail'); 
    } 
    } 
    } 
  • 相关阅读:
    VS2010程序打包
    Extjs布局
    Extjs4.x完美treepanel checkbox无限级选中与取消
    extjs 4.2 日期控件 选择时分秒功能
    extjs4.0下的日期控件的星期显示为y的解决办法
    linux下mysql 配置
    坐标轴笔记
    cpp 内嵌函数(lambda,struct)
    ue4 笔记
    ue4 蓝图方法备份
  • 原文地址:https://www.cnblogs.com/blibli/p/7573522.html
Copyright © 2011-2022 走看看