原生JS实现ajax 发送post请求
1. [代码]原生JS实现ajax 发送post请求
<script>
var oStr = '';
var postData = {};
var oAjax = null;
//post提交的数据
postData = {"name1":"value1","name2":"value2"};
//这里需要将json数据转成post能够进行提交的字符串 name1=value1&name2=value2格式
postData = (function(value){
for(var key in value){
oStr += key+"="+value[key]+"&";
};
return oStr;
}(postData));
//这里进行HTTP请求
try{
oAjax = new XMLHttpRequest();
}catch(e){
oAjax = new ActiveXObject("Microsoft.XMLHTTP");
};
//post方式打开文件
oAjax.open('post','1.php?='+Math.random(),true);
//post相比get方式提交多了个这个
oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//post发送数据
oAjax.send(postData);
oAjax.onreadystatechange = function(){
//当状态为4的时候,执行以下操作
if(oAjax.readyState == 4){
try{
alert(oAjax.responseText);
}catch(e){
alert('你访问的页面出错了');
};
};
};
</script>
原生JS实现ajax 发送post请求的更多相关文章
- 用原生JS实现AJAX和JSONP
前端开发在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的.其实,原生 ...
- 原生JS实现Ajax及Ajax的跨域请求
前 言 如今,从事前端方面的程序猿们,如果,不懂一些前后台的数据交互方面的知识的话,估计都不太好意思说自己是程序猿.当然,如今有着许多的框架,都有相对应的前后台数据交互的方法. ...
- 原生js实现Ajax
一般来说,大家可能都会习惯用JQuery提供的Ajax方法,但是用原生的js怎么去实现Ajax方法呢? JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataT ...
- 使用原生js写ajax
// 使用原生js 封装ajax // 兼容xhr对象 function createXHR(){ if(typeof XMLHttpRequest != "undefined") ...
- 原生JS的Ajax技术
1.同步和异步 同步现象:客户端发送请求到服务器端,当服务器返回响应之前,客户端都处于等待 卡死状态 异步现象:客户端发送请求到服务器端,无论服务器是否返回响应,客户端都可以随意做其他事情,不会被卡 ...
- 原生js实现ajax与jquery的ajax库,及json
这是一篇笔记博客, Ajax: 和服务器进行数据交换(异步) 用js实现复杂的原理:用于发送请求的对象在不同的浏览器中是不同的 同源策略:ajax发送请求的url地址与服务器地址必须是同一域名,协议, ...
- 用原生js实现ajax、jsonp
转载: http://www.cnblogs.com/yangheng/p/6065910.html 一.原生js实现ajax $.ajax({ url: '', type: 'post', data ...
- 原生js写Ajax
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.挺对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
- Ajax工作原理和原生JS的ajax封装
前言: 之所以用ajax作为博客的开篇,是因为无论从ajax的出现还是从它的作用上来说,ajax对于前端无疑是意义重大的.甚至可以说,是ajax带来了前端这个行业.当然,历史并不能说明当下,曾经的辉煌 ...
随机推荐
- 检出商品详情中的图片并替换url
原有的批量导入是按照系统本身的功能导入商品,现在需要用接口将图片上传图片服务器 所以需要将批量导入的商品图片取出来,上传后替换掉原来的url (1)检出详情中的图片,用文件名做key private ...
- 03-Linux各目录及每个目录的详细介绍
Linux各目录及每个目录的详细介绍 [常见目录说明] 目录 /bin 存放二进制可执行文件(ls,cat,mkdir等),常用命令一般都在这里. /etc 存放系统管理和配置文件 /home 存放所 ...
- Linux+Redis实战教程_day02_Linux系统上安装MySQL
Linux系统上安装MySQL 安装MySQL 卸载自带mysql 查询mysql的安装情况,可以直接使用了 rpm -qa | grep -i mysql –-color 卸载原生的MySQL rp ...
- 8 -- 深入使用Spring -- 2...2 指定Bean的作用域
8.2.2 指定Bean的作用域 当使用XML 配置方式来配置Bean实例时,可以通过scope来指定Bean实例的作用域,没有指定scope属性的Bean实例作用域默认是singleton. 当采用 ...
- Docker background
什么是 Docker? Docker 提供了一个可以运行你的应用程序的封套(envelope),或者说容器.它原本是 dotCloud 启动的一个业余项目,并在前些时候开源了.它吸引了大量的关注和讨论 ...
- 反射简介—C#特性和反射
.NET编译器的任务之一就是为所有定义和引用的类型生成元数据描述.除了程序集中标准的元数据外,.NET平台还支持特定(attribute)把更多的元数据嵌入到程序集中. .NET特性扩展了抽象的Sys ...
- C 修改命令行文本颜色
#include <Windows.h> #include <stdio.h> int main() { HANDLE h = GetStdHandle(STD_OUTPUT_ ...
- 【Ceisum】Max转GLTF
参考资料:https://blog.csdn.net/u011394175/article/details/78919281 1.在3DsMax中加入COLLADA插件:COLLADA-MAX-PC_ ...
- 【Android】java.lang.RuntimeException: java.lang.Throwable: A WebView method was called on thread 'JavaBridge'.
一.问题 Java调用JS事件出现 java.lang.RuntimeException: java.lang.Throwable: A WebView method was called on th ...
- hudson.AbortException: No files found in path D:\testproject\project2\testoutput\ with configured filemask: output.xml
错误描述: hudson.AbortException: No files found in path D:\testproject\project2\testoutput\ with configu ...