使用原生js寫ajax

来源:http://www.cnblogs.com/gaobint/archive/2017/05/30/6921768.html
-Advertisement-
Play Games

// 使用原生js 封裝ajax // 相容xhr對象 function createXHR(){ if(typeof XMLHttpRequest != "undefined"){ // 非IE6瀏覽器 return new XMLHttpRequest(); }else if(typeof Ac... ...


 

 

// 使用原生js 封裝ajax
// 相容xhr對象
function createXHR(){
    if(typeof XMLHttpRequest != "undefined"){ // 非IE6瀏覽器
        return new XMLHttpRequest();
    }else if(typeof ActiveXObject != "undefined"){   // IE6瀏覽器
        var version = [
                    "MSXML2.XMLHttp.6.0",
                    "MSXML2.XMLHttp.3.0",
                    "MSXML2.XMLHttp",
        ];
        for(var i = 0; i < version.length; i++){
            try{
                return new ActiveXObject(version[i]);
            }catch(e){
                //跳過
            }
        }
    }else{
        throw new Error("您的系統或瀏覽器不支持XHR對象!");
    }
}
// 轉義字元
function params(data){
    var arr = [];
    for(var i in data){
        arr.push(encodeURIComponent(i) + "=" + encodeURIComponent(data[i]));
    }
    return arr.join("&");
}
// 封裝ajax
function ga_ajax(obj){
    var xhr = createXHR();
    obj.url = obj.url + "?rand=" + Math.random(); // 清除緩存
    obj.data = params(obj.data);      // 轉義字元串
    if(obj.method === "get"){      // 判斷使用的是否是get方式發送
        obj.url += obj.url.indexOf("?") == "-1" ? "?" + obj.data : "&" + obj.data;
    }
    // 非同步
    if(obj.async === true){
        // 非同步的時候需要觸發onreadystatechange事件
        xhr.onreadystatechange = function(){
            // 執行完成
            if(xhr.readyState == 4){
                callBack();
            }
        }
    }
    xhr.open(obj.method,obj.url,obj.async);  // false是同步 true是非同步 // "demo.php?rand="+Math.random()+"&name=ga&ga",
    if(obj.method === "post"){
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xhr.send(obj.data);
    }else{
        xhr.send(null);
    }
    // xhr.abort(); // 取消非同步請求
    // 同步
    if(obj.async === false){
        callBack();
    }
    // 返回數據
    function callBack(){
        // 判斷是否返回正確
        if(xhr.status == 200){
            obj.success(xhr.responseText);
        }else{
            obj.Error("獲取數據失敗,錯誤代號為:"+xhr.status+"錯誤信息為:"+xhr.statusText);
        }
    }
}

var html = document.getElementsByTagName("html")[0];
html.onclick = function(){
    ga_ajax({
        "method" : "post",
        "url" : "demo.php",
        "data" : {
            "name" : "gao",
            "age" : 100,
            "num" : "12346&598"
        },
        "success" : function(data){
            alert(data);
        },
        "Error" : function(text){
            alert(text);
        },
        "async" : false
    });
}

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 什麼是委托?還記得C/C++語言里的函數指針嗎?委托就是他的”升級版“。先看一個簡單的小程式: 直接調用和間接調用他們的運行結果是一樣的變數和函數到底是啥?變數(代表數據)是以變數名對應的記憶體地址為起點的一段記憶體中所存儲的值函數(代表演算法)是以函數名對應的記憶體地址為起點的一段記憶體中所存儲的一組機器語 ...
  • 前幾天做一個小小小項目,使用了MVC+Bootstrap,以前做分頁都是非同步載入Mvc部分視圖的方式,因為這個是小項目,就隨便一點。一般的列表頁面,少不了有查詢條件,下麵分享下Drapper+PagedList.Mvc支持多查詢條件分頁的使用經驗。 在MVC中我們一般習慣使用強類型Model,通過分 ...
  • 一、前言 在ComboBox中嵌入若幹個CheckBox時,當我們勾選一些CheckBox,ComboBox會顯示相應的勾選項。 例如:CheckBox項有A,B,C 那麼勾選這三項,ComboBox會顯示A,B,C 但有時候我們會發現,點擊CheckBox時,ComboBox會出現對象的名稱,而不 ...
  • .NET 4.5 中包含取消架構,允許以標準方式取消長時間運行的任務。每個阻塞調用都應支持這種機制。但目前,並不是所有阻塞調用都實現了這個新技術。已經實現了這種機制的技術有任務(http://www.cnblogs.com/afei-24/p/6907840.html),併發集合類(http://w ...
  • 媽媽再也不用為我轉Json而擔憂了!! 很簡單,沒什麼好說明的,嗯! 1 protected void Page_Load(object sender, EventArgs e) 2 { 3 if (!IsPostBack) 4 { 5 ToJsonGetData tjgd = new ToJson ...
  • Asp.Net Core MVC RazorPage多語言實現方法 ...
  • 可以編寫angularjs的自定義指令來實現驗證文本框填入的數值是來為小數。 airExpressApp.directive('validateDecimalCharacters', function () { var REQUIRED_PATTERNS = [ /^-?[0-9]\d*(\.\d+ ...
  • 前幾天Insus.NET有寫過一篇《angularjs自定義指令Directive》http://www.cnblogs.com/insus/p/6908815.html 僅是在程式中指定某些來值來匹配。為你的數據表準備一個存儲過程: 判斷是否已經存在此值。只需寫SELECT語句。如果沒有記錄返回, ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...