防止IE下不支持 Ajax

<button id="btn1">请求</button>
<button id="btn2">请求</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",              //请求地址type: "GET",                       //请求方式data: { name: "super", age: 20 },        //请求参数dataType: "json",success: function (response, xml) {// 此处放成功后执行的代码
                console.info(response);console.info(xml);},fail: function (status) {// 此处放失败后执行的代码
            }});})function ajax(options) {options = options || {};options.type = (options.type || "GET").toUpperCase();options.dataType = options.dataType || "json";var params = formatParams(options.data);//创建 - 非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);}}}//连接 和 发送 - 第二步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);//设置表单提交时的内容类型xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");xhr.send(params);}}//格式化参数
    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>

转载于:https://www.cnblogs.com/Jacob-Wu/p/6632718.html

JS 原生 AJax相关推荐

  1. JS原生Ajax和jQuery的Ajax与代码示例

    JS原生Ajax和jQuery的Ajax [学习目标] 1,了解JS原生Ajax原理 2,掌握json数据格式 掌握json数据格式方式 掌握json的解析方式 3,掌握jQuery中的Ajax封装 ...

  2. js原生ajax跨域请求,封装一个原生js的ajax请求,支持IE9CORS跨域请求

    前言 关于纯js的ajax请求,我之前有文章写过, https://www.haorooms.com/post/js_ajax_chun , 关于CORS跨域资源共享,我也有文章写过, https:/ ...

  3. js原生ajax写法

    博主在大二做数据库课设时,接触的js. 边学边做,当时还没接触ajax,所以在遇到每次请求地址都会刷新这个问题时, 博主干了你们绝对想不到的事:在页面里用了很多"隐形"的frame ...

  4. JS原生Ajax的使用

    1.XHR对象,原生版的Ajax xhr(俗称小黄人,O(∩_∩)O~),全名XMLHttpRequest ajax的onload方法是数据接收完毕后执行的函数. 2.FormData,模拟表单对象, ...

  5. js原生ajax实例详解

    <!DOCTYPE HTML> <html><head><title>please enter your title</title>< ...

  6. js原生ajax与jquery的ajax的用法区别

    什么是ajax和原理? AJAX 是一种用于创建快速动态网页的技术. 通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据 XMLHttpRequest对象的基本属性: onre ...

  7. 原生JS写Ajax的请求函数

    本文主要介绍了如何通过原生JavaScript封装ajax请求,文中给出了具体的实现代码和详细的解释,希望对你有所帮助. 一.JS原生Ajax ajax:一种请求数据的方式,不需要刷新整个页面: aj ...

  8. .ajax get 写法,原生Ajax写法(GET)

    ajax的GET提交方式的原生代码: var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else if(w ...

  9. 原生js实现Ajax,JSONP

    Ajax内部的几个执行步骤 创建XMLHttpRequest对象(new XMLHttpRequest()) 设置请求头(setRequestHeader) 连接服务器(open()) 设置回调(on ...

最新文章

  1. 查找手机型号云服务器,查找手机型号云服务器
  2. 利用jsoncpp将json字符串转换为Vector
  3. leetcode 64. 最小路径和(递归 / 动态规划解法图解)(Java版)
  4. 38Exchange 2010升级到Exchange 2013-安装第二台CAS2013
  5. 得意而忘乎形:谈葛水平的水墨画
  6. LeetCode 455. 分发饼干(贪心)
  7. 三维数据平滑处理_黑白象片的密度信息 卫星数据处理 遥感制图 三维建模 善图科技...
  8. 【数据分析】基于matlab GUI kmeans聚类分组系统【含Matlab源码 510期】
  9. proc文件系统、sysfs文件系统、kobject操作
  10. Chromedriver和Chrome浏览器版本
  11. round()函数的用法
  12. 几何公差基础知识之平行度
  13. 【帝国CMS】灵动标签调用标题图片没有图片时显示默认图片
  14. 计算机关机界面卡住,Win7关机缓慢,关机后一直卡在正在关机界面
  15. OSChina 周五乱弹 ——妹子一不小心就被拖到小巷子里
  16. CTF之Bugku 秋名山老司机+python脚本代码解析
  17. vb6使用WinRAR压缩和解压文件
  18. 如何获取vs code中插件Waka Time的API key
  19. python windows curses库安装教程
  20. 程序员的悲哀--动车追尾

热门文章

  1. 关于杨振宁的一些观点的感想
  2. kafka的offset笔记
  3. xxxx is not found in PojoType<Order, fields = [amount: Integer, product: String, user: Long]>
  4. superset设置自动刷新
  5. 数据仓库设计方案(转载)
  6. windows下面sublime无法粘贴复制的问题解决(转)
  7. NLPIR RuntimeError: NLPIR function 'NLPIR_Init' failed 解决方案
  8. 把汇集多个json文件的txt进行分割,然后批量修改文件名后缀
  9. GL_RGBA和GL_RGB的差别
  10. 5.2 最优近似解 $\mathbf{\hat{x}} = A^{-1}_L\mathbf{b}$ 是最小二乘解