<!DOCTYPE html>
<html>

<head>
<title></title>
<script type="text/javascript">
ajax({
url: "http://localhost:8080/save",
type: "POST",
data: {},
dataType: "json",
username: 'sss',
success: function(response, xml) {
// 此处放成功后执行的代码
debugger;
},
fail: function(status) {
// 此处放失败后执行的代码
debugger;
}
});

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>
</head>

<body>
</body>

</html>

js 发送ajax请求(XMLHttpRequest)的更多相关文章

  1. 原生js发送ajax请求

    堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...

  2. 原生JS发送Ajax请求、JSONP

    一.JS原生Ajax Ajax=异步Javascript+XML: ajax是一种数据请求的方式,不需要刷新整个页面.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ajax的核心 ...

  3. js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可)

    js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可) 一.总 ...

  4. 在发送ajax请求时加时间戳或者随机数去除js缓存

    在发送ajax请求的时候,为了保证每次的都与服务器交互,就要传递一个参数每次都不一样,这里就用了时间戳 大家在系统开发中都可能会在js中用到ajax或者dwr,因为IE的缓存,使得我们在填入相同的值的 ...

  5. js中使用队列发送ajax请求

    最近,项目中需要按照先后顺序发送ajax请求,并且在一次请求结束后才能发起下一次,不然就会导致逻辑错误. 解决办法是定义一个数组,保存ajax请求数据. 以下使用extjs4定义一个类 Ext.def ...

  6. Axios发送AJAX请求

    目录 Axios 特征 axios提供主要三种发起请求的方式 方式一:直接axios实例直接call方式 方式二:通过axios实例提供的不同http请求方式的方法 方式三:其实是从第二种方式中单独提 ...

  7. js的ajax请求

    1 js原生get请求 <script> window.onload = function(){ var oBtn = document.getElementById('btn'); oB ...

  8. jQuery发送ajax请求

    利用jquery发送ajax请求的几个模板代码. $.ajax({ async : false, type: 'POST', dataType : "json", url: &qu ...

  9. JQuery发送ajax请求不能用数组作为参数

    JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){        var select ...

随机推荐

  1. try catch 学习记入

    执行过程 public void method(Action action) { //2.method执行中 try { action(); //3.调用委托 "; //如果action执行 ...

  2. LED限流电阻的大小计算

    很多时候电路中都用LED做指示,这就涉及到限流电阻,这个怎么选取呢? 可以举个例子,贴片蓝色LED datasheet上参数如下 要注意理解LED Datasheet上的参数.最重要的三个参数如下: ...

  3. QQ登录-第三方SDK的接入总结(搜索 qq互联)

    由于项目的需要,使用了[QQ登录]SDK 的相关功能!   1.集成[QQ登录]SDK   [QQ登录]SDK下载地址: http://wiki.open.qq.com/wiki/website/SD ...

  4. 【转】三星8552 手机提示升级系统 完成后重启 开机画面一直停留在三星的LOGO 一闪一闪 怎么办

    原文网址:http://ask.zol.com.cn/q/309501.html 楼主你好,手机出现这种情况的话,可以先将电池取下来重新安装,如果不能的话,可以在关机状态下按住电源键+音量下键之后进入 ...

  5. 【转】Android UI系列-----时间、日期、Toasts和进度条Dialog

    原文网址:http://www.cnblogs.com/xiaoluo501395377/p/3421727.html 您可以通过点击 右下角 的按钮 来对文章内容作出评价, 也可以通过左下方的 关注 ...

  6. Edit Distance 解答

    Question Given two words word1 and word2, find the minimum number of steps required to convert word1 ...

  7. JDBC编程之优化

    1.创建 dbconfig.properties driver=com.mysql.jdbc.Driver dburl=jdbc\:mysql\://localhost\:3306/mytest us ...

  8. android后台截屏实现(3)--编译screencap

    修改好之后就要编译了,screencap的编译是要在源码环境中进行的. 将修改后的screencap.cpp文件替换源码中的原始文件,然后修改screencap的Android.mk文件,修改后的文件 ...

  9. 设置应用中出现NFC服务,去掉

    还可以在 里面修改

  10. [Javascript] Safe Nested Object Inspection

    A common problem when dealing with some kinds of data is that not every object has the same nested s ...