文档章节

原生js的ajax请求

彭良维--莫欺博客
 彭良维--莫欺博客
发布于 2016/10/13 11:54
字数 283
阅读 9
收藏 0

原生js的ajax数据请求

注:原生的ajax请求.在发送post请求的时候,

请求的Content-Type为text/plain;charset=UTF-8,而请求参数在Request Payload中。

如果是使用jq发送post请求,参数在Form Data

这里要注意post请求的Content-Type为application/x-www-form-urlencoded,参数是在请求体中,即上面请求中的Form Data。

最后查阅文档才知道,   

HTTP POST表单请求提交时,使用的Content-Type是application/x-www-form-urlencoded,而使用原生AJAX的POST请求如果不指定请求头RequestHeader,默认使用的Content-Type是text/plain;charset=UTF-8。

也就是解决这个问题就是要求设置请求头

//手机号绑定
function apply(){

var XHR=null;  
if (window.XMLHttpRequest) {  
   // 非IE内核  
   XHR = new XMLHttpRequest();  
} else if (window.ActiveXObject) {  
   // IE内核,这里早期IE的版本写法不同,具体可以查询下  
   XHR = new ActiveXObject("Microsoft.XMLHTTP");  
} else {  
   XHR = null;  
}  
 
if(XHR){  

var code = document.getElementById("numcode").value
var mobile=document.getElementById("num").value
var postdata="mobile="+mobile+"&code="+code


   XHR.open("POST", "/ajax/json/live/dosignup");  
XHR.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  
   
   XHR.onreadystatechange = function () {  
       if (XHR.readyState == 4 && XHR.status == 200) {  
           var mydata =JSON.parse(XHR.responseText); 
           console.log(mydata)
           if(mydata.code){
            document.getElementById("codeerr").style.display='block'
            document.getElementById("msgcode").innerText=mydata.msg
           }else{
            $('.zao').css('display','none')
location.reload()
           }
           
           XHR = null;  
       }  
   };  

   XHR.send(postdata);  
}  



}

 

© 著作权归作者所有

彭良维--莫欺博客
粉丝 2
博文 10
码字总数 4806
作品 0
北京
前端工程师
私信 提问
放下Axios,手写纯原生Ajax通信接口

前言 axios作为vue框架中最常用的ajax工具包之一,可以与后台API接口进行通信,传送或接收数据,在前后端分离开发中,发挥了通信桥梁的重要作用。 虽然像axios这样的第三方工具包很好用,但是...

WebBoy
09/22
0
0
原生JavaScript实现AJAX、JSONP

相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要...

TGCode
09/29
0
0
jquery.Ajax回调成功后数据赋值给全局变量的问题

先来看一代码 function checkoldpass($pass) { $.ajax({ type: 'get', url: '/admin/check', data: {'password': $pass}, dataType: 'json', success: function (data) { console.log(data) ......

xtceetg
2018/06/28
0
0
Python3基础之学习笔记(十五)-Ajax-文件上传-图片验证码

1. Django 1.1 Ajax 1.1.1 Ajax简介 AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”。即使用Javascript语言与服务器进行异步交互,传输的数据为XML(当然,...

GoldenKitten
01/17
0
0
javascript实现原生ajax的几种方法

自从js有了各种框架之后,比如jquery,使用ajax已经变的相当简单了。但有时候为了追求简洁,可能项目中不需要加载jquery这种庞大的js插件。但又要使用到ajax这种功能该如何办呢?下面和大家分...

BearCatYN
2015/06/04
1K
1

没有更多内容

加载失败,请刷新页面

加载更多

nginx常用命令

# cd /usr/local/nginx/sbin 查看版本 # ./nginx -v 查看进程 # ps -ef | grep nginx 查看nginx端口号 # ss -lnput | grep nginx 启动 # ./nginx 关闭 # ./nginx -s stop 重新加载配置文件 ......

行者终成事
6分钟前
2
0
002-docker的网络设置和数据管理

Docker 网络设置 docker会创建一个桥接网卡[docker 0],docker有两种映射方式,一种是随机映射,一种是指定映射 生产场景一般不用随机映射 随机映射的好处是端口由docker分配,不会冲突 安装n...

侠客行之石头
10分钟前
1
0
Rust学习笔记一 数据类型

写在前面 我也不是什么特别厉害的大牛,学历也很低,只是对一些新语言比较感兴趣,接触过的语言不算多也不算少,大部分也都浅尝辄止,所以理解上可能会有一些偏差。 自学了Java、Kotlin、Python、...

MusiCodeXY
12分钟前
2
0
Java 脚本引擎入门

Java Script Engine Java 脚本引擎可以将脚本嵌入Java代码中,可以自定义和扩展Java应用程序,自JDK1.6被引入,基于Rhino引擎,JDK1.8后使用Nashorn引擎,支持ECMAScript 5,但后期还可能会换...

阿提说说
58分钟前
5
0
05.深入浅出索引(下)

在下面这个表T中,如果我们执行select * from T where k between 3 and 5,需要执行几次树的搜索操作,会扫描多少行? mysql> create table T ( id int primary key, k int not null default...

scgaopan
昨天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部