ajax发送GET和POST请求
1、ajax-get请求demo
<script>
document.getElementById("buttonname").onclik=function(){
//发送AJAX查询请求
var request=new XMLHttpRequest();
request.open("GET","xxxx.jsp?name="+document.getElementById("name").value + "&old="+document.getElementById("old").value);
request.send();
request.onreadystatechange = funtion(){
if(request.readState===4){
if(request.status===200){
document.getElementById("div").innetHTML= request.responseText;
}else{
alert("请求错误"+request.status);
}
}
} }
</script>
2、ajax-post请求demo
1 <script>
2 document.getElementById("buttonname").onclik=function(){
3 //发送AJAX查询请求
4 var request=new XMLHttpRequest();
5 request.open("POST","xxxx.jsp");
var data="name="+document.getElementById("name").value
+"&old="+document.getElementById("old").value;
requeat.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
6 request.send(data);
7 request.onreadystatechange = funtion(){
8 if(request.readState===4){
9 if(request.status===200){
10 document.getElementById("div").innetHTML= request.responseText;
11 }else{
12 alert("请求错误"+request.status);
13 }
14 }
15 }
16
17 }
18 </script>
3、ajax请求-返回JSON格式
{
"success":"true",
"msg":"text"
}
1 <script>
2 document.getElementById("buttonname").onclik=function(){
3 //发送AJAX查询请求
4 var request=new XMLHttpRequest();
5 request.open("GET","xxxx.jsp?name="+document.getElementById("name").value + "&old="+document.getElementById("old").value);
6 request.send();
7 request.onreadystatechange = funtion(){
8 if(request.readState===4){
9 if(request.status===200){
var data=JSON.parse(request.responseText);
if(data.success){
document.getElementById("div").innetHTML= data.msg;
}else{
12 document.getElementById("div").innetHTML= data.msg;
13 }
10 }else{
12 alert("请求错误"+data.msg);
13 }
15 }
16
17 }
18 </script>
4、jQuery实现ajax
jQuery.ajax([settings])
type:类型,post或get,默认为get
url:发送请的地址
data:是一个对象,连同请求发送到服务器的数据
dataType:预期服务器返回的数据类型。如果不指定,jquery将自动根据HTTP包MIME信息来智能判断,一般我们采用json格式,可以设置为"json"
success:是一个方法,请求成功后的回调函数。传入返回的数据,以及包含成功代码的字符串
error:是一个方法,请求失败时调用此函数。传入XMLHttpRquest对象
例子:
$(document).ready(funtion(){
$("#name").click(funtion(){
$.ajax({
type:"GET",
url:"XXX.jsp?name="+$("#name").val(),
dataType:"json",
success:funtion(data){
if(data.success){
$("#name").html(data.msg);
}esle{
$("#name").html("发错了"+data.msg);
}
},
error.funtion(jqXHR){
alert("出错了"+jqXHR.status);
}
});
});
}
)
jquery.ajax示例
$(function(){
//请求参数
var list = {};
//
$.ajax({
//请求方式
type : "POST",
//请求的媒体类型
contentType: "application/json;charset=UTF-8",
//请求地址
url : "http://127.0.0.1/admin/list/",
//数据,json字符串
data : JSON.stringify(list),
//请求成功
success : function(result) {
console.log(result);
},
//请求失败,包含具体的错误信息
error : function(e){
console.log(e.status);
console.log(e.responseText);
}
});
});
//JSON.stringify 将对象转为字符串
var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);
//JSON.parse 将字符串转化为对象
var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');
ajax发送GET和POST请求的更多相关文章
- 【转】AJAX发送 PUT和DELETE请求注意事项
jax使用restful服务发送put 和 delete 请求时直接传参会出现问题 一,采用POST + _method:delete/put + filter 的方法ajax发送put 和 de ...
- AJAX发送 PUT和DELETE请求参数传递注意点,了解一下
ajax发送put 和 delete 请求时,需要传递参数,如果参数在url地址栏上,则可以正常使用, 如果在 data:中需要传递参数,(浏览器会使用表单提交的方式进行提交) 则需要注意此时应作如下 ...
- 通过 Ajax 发送 PUT、DELETE 请求的两种实现方式
一.普通请求方法发送 PUT 请求 1. 如果不用 ajax 发送 PUT,我们可以通过设置一个隐藏域设置 _method 的值,如下: <form action="/emps&quo ...
- Ajax发送GET和POST请求案例
使用ajax实现菜单联动 通常情况下,GET请求用于从服务器上获取数据,POST请求用于向服务器发送数据. 需求:选择第一个下拉框的值,根据第一个下拉框的值显示第二个下拉框的值 首先使用GET方式. ...
- Ajax发送GET、POST请求和响应XML数据案例
1.新建工程 新建一个java web工程,新建一个Servlet文件 AServlet.java,用于返回get和post请求. public class AServlet extends Http ...
- 原生Ajax发送get、post请求每一步
说明 发送Ajax的请求的核心对象是XMLHttpRequest,因此我们需要了解该对象的相关属性和方法 方法(图一) 属性(图二) 第一步:创建 XMLHttpRequest对象,下面都简写为 xh ...
- Ajax发送异步请求(四步操作)
1.第一步(得到XMLHttpRequest) *ajax其实只需要学习一个对象:XMLHttpRequest,如果掌握了它,就掌握了ajax!! *得到XMLHttpRequest >大多数浏 ...
- Ajax详解及其案例分析------如何获得Ajax对象,使用Ajax对象发送GET和POST请求,校验用户名,POST和GET请求时的乱码处理,实现级联的下拉列表
本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...
- Ajax发送POST请求的心路历程
好多年前就在项目中用ajax实现了页面部分数据的发送,当时用的是GET方法. 这次用POST方法实现同样的功能,竟然花费了不少的时间! ① 关于JQuery ajax的配置项说明 url : 请求的u ...
随机推荐
- Integer.parseInt(s)、Integer.valueOf(s)与new Integer()的异同
我们在开发过程中,很多时候需要将String类型数据转换成Integer,而比较常用的方式就是--nteger.parseInt(s).Integer.valueOf(s)与new Integer() ...
- Docker on startup: “No activity detected on VM, aborting”
windows下安装的docker,切换到linux,一直处于重启中,最后报No activity detected on VM, aborting错误 上网百度一下这个错误,基本上没人遇到过,最后在 ...
- C++泛型算法总结
1 accumulate(b,e,T) 累和(基础和为T) 注意T的类型必须和序列中元素类型相同,如double序列后面的T就必须是0.0,如果是0就会把序列中的数当成int进行求和 2 count( ...
- 股票数据Scrapy爬虫
功能描述: 技术路线:scrapy 目标:获取上交所和深交所所有股票的名称和交易信息 输出:保存到文件中 数据网站的确定 获取股票列表: 东方财富网:http://quote.eastmoney.co ...
- drf框架,restful接口规范,源码分析
复习 """ 1.vue如果控制html 在html中设置挂载点.导入vue.js环境.创建Vue对象与挂载点绑定 2.vue是渐进式js框架 3.vue指令 {{ }} ...
- 【音乐欣赏】《JINGO JUNGLE》 - MYTH & ROID
歌名:JINGO JUNGLE 作者:MYTH & ROID [00:19.82]Don’t go away 逃げ場はない [00:27.12]Oh why? You’re crying 嗤え ...
- Atcoder Beginner Contest152F(DFS+状压DP)
二维状压写成一维状压,省略加上第i条边这一维 #define HAVE_STRUCT_TIMESPEC #include<bits/stdc++.h> using namespace st ...
- Linux shell cut 命令详解
详细资料请参考:博客园骏马金龙 https://www.cnblogs.com/f-ck-need-u/p/7521357.html cut命令将行按指定的分隔符分割成多列,它的弱点在于不好处理多个分 ...
- blog主题——马路
blog主题,存储一下 css /************************************************** 第一部分:所有的模板都使用的公共样式.公告样式是为了更好的向前 ...
- deepin-wine-qq无法加载图片解决方案
最近在qq水群讨论学术的时候发现了一个奇怪的问题:无法加载图片. 具体点是,如果图片没有被其他设备接收,并且在缓存中,图片是可以加载的,反之不可. 这东西很烦人啊,于是我就去查项目issue:http ...