當(dāng)前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JS 原生 AJax
生活随笔
收集整理的這篇文章主要介紹了
JS 原生 AJax
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
防止IE下不支持 Ajax
<button id="btn1">請(qǐng)求</button> <button id="btn2">請(qǐng)求</button><script>$("#btn2").click(function () {$.ajax({type: "Get",url: '/Home/ResponseAjax',data: { name: "super", age: 20 },success: function (res) {console.info(res);}})})$("#btn1").click(function () {ajax({url: "./ResponseAjax", //請(qǐng)求地址type: "GET", //請(qǐng)求方式data: { name: "super", age: 20 }, //請(qǐng)求參數(shù)dataType: "json",success: function (response, xml) {// 此處放成功后執(zhí)行的代碼 console.info(response);console.info(xml);},fail: function (status) {// 此處放失敗后執(zhí)行的代碼 }});})function ajax(options) {options = options || {};options.type = (options.type || "GET").toUpperCase();options.dataType = options.dataType || "json";var params = formatParams(options.data);//創(chuàng)建 - 非IE6 - 第一步if (window.XMLHttpRequest) {var xhr = new XMLHttpRequest();} else { //IE6及其以下版本瀏覽器var xhr = new ActiveXObject('Microsoft.XMLHTTP');}//接收 - 第三步xhr.onreadystatechange = function () {if (xhr.readyState == 4) {var status = xhr.status;if (status >= 200 && status < 300) {options.success && options.success(xhr.responseText, xhr.responseXML);} else {options.fail && options.fail(status);}}}//連接 和 發(fā)送 - 第二步if (options.type == "GET") {xhr.open("GET", options.url + "?" + params, true);xhr.send(null);} else if (options.type == "POST") {xhr.open("POST", options.url, true);//設(shè)置表單提交時(shí)的內(nèi)容類型xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");xhr.send(params);}}//格式化參數(shù) function formatParams(data) {var arr = [];for (var name in data) {arr.push(encodeURIComponent(name) + "=" + encodeURIComponent(data[name]));}arr.push(("v=" + Math.random()).replace(".", ""));return arr.join("&");} </script>?
轉(zhuǎn)載于:https://www.cnblogs.com/Jacob-Wu/p/6632718.html
總結(jié)
以上是生活随笔為你收集整理的JS 原生 AJax的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: bzoj2957:楼房重建
- 下一篇: laravel框架总结(一) -- 请求