js 发送ajax请求(XMLHttpRequest)
<!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)的更多相关文章
- 原生js发送ajax请求
堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...
- 原生JS发送Ajax请求、JSONP
一.JS原生Ajax Ajax=异步Javascript+XML: ajax是一种数据请求的方式,不需要刷新整个页面.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ajax的核心 ...
- js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可)
js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可) 一.总 ...
- 在发送ajax请求时加时间戳或者随机数去除js缓存
在发送ajax请求的时候,为了保证每次的都与服务器交互,就要传递一个参数每次都不一样,这里就用了时间戳 大家在系统开发中都可能会在js中用到ajax或者dwr,因为IE的缓存,使得我们在填入相同的值的 ...
- js中使用队列发送ajax请求
最近,项目中需要按照先后顺序发送ajax请求,并且在一次请求结束后才能发起下一次,不然就会导致逻辑错误. 解决办法是定义一个数组,保存ajax请求数据. 以下使用extjs4定义一个类 Ext.def ...
- Axios发送AJAX请求
目录 Axios 特征 axios提供主要三种发起请求的方式 方式一:直接axios实例直接call方式 方式二:通过axios实例提供的不同http请求方式的方法 方式三:其实是从第二种方式中单独提 ...
- js的ajax请求
1 js原生get请求 <script> window.onload = function(){ var oBtn = document.getElementById('btn'); oB ...
- jQuery发送ajax请求
利用jquery发送ajax请求的几个模板代码. $.ajax({ async : false, type: 'POST', dataType : "json", url: &qu ...
- JQuery发送ajax请求不能用数组作为参数
JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){ var select ...
随机推荐
- TimeZone 时区 (JS .NET JSON MYSQL)
来源参考 : http://www.cnblogs.com/qiuyi21/archive/2008/03/04/1089456.html 来源参考 : http://walkingice.blogs ...
- Big Data Analytics for Security(Big Data Analytics for Security Intelligence)
http://www.infoq.com/articles/bigdata-analytics-for-security This article first appeared in the IEEE ...
- 在网页上看到想要的颜色,如何知道这种颜色的颜色代码和 RGB 颜色值?
启动QQ的情况下,按截图快捷键(ctrl+alt+A),鼠标移动到要取色的地方即可看到,如下图: references: http://www.zhihu.com/question/20328538
- Django中生成PDF(一)
Django中生成PDF(一) 需求描述: 某网站与其用户达成一致的协议,每份协议中都有用户相关的独特信息,且还需要生成PDF并存档.PDF文件中需要有企业LOGO.文字描述等信息.其展现形式 ...
- Unity Inspector 给组件自动关联引用
项目进入上线阶段了, 有一些地方需要总结和优化. 我发现UI一改变,我就要拖很久的UI. UI结构发生改变我还必须给一些变量设置好引用,后来我去看别人预设的时候组件拖放的变量至少10个以上, 它们一 ...
- (转)Linux下Apache 限速模块安装笔记
参考文章:http://www.pcmag.com.cn/solution/net/story/200704/51003104.shtml 限线程:http://dominia.org/djao/li ...
- 【自由谈】城域网IPv6过渡技术——4v6场景技术总结(1)
为什么会存在4v6应用场景?主要是从“云-管-端”的IPv6状态决定的,“云”侧IPv4类业务丰富,IPv6驱动力小,所以“云”在较长一段时间内还是以IPv4类业务为主.“管”侧的IPv6化程度高,设 ...
- SurfaceView类透明背景设置
将SurfaceView背景设置为透明,主要添加以下几句话就可以了: 在SurfaceView创建后设置一下下面的参数: setZOrderOnTop(true); getHolder().setFo ...
- Oracle Directory文件夹的知识
在上一章介绍expdp/impdp时曾使用过DIRECTORY这个概念,以下再简单说明下DIRECTORY的点点滴滴. MOS上对DIRECTORY的解释(266875.1): (1).基于服务端 v ...
- AsyncHttpClient 登录 Application Fragment 回调 监听 软键盘
Activity /**登录界面及登陆后用户首页界面,使用两个Fragment实现*/ public class LoginActivity extends Activity implements L ...