正文
js进阶 14-6 $.ajax()方法如何使用
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
js进阶 14-6 $.ajax()方法如何使用一、总结一句话总结：$.ajax([settings])settings可选。用于配置Ajax请求的键值对集合。
1、$.ajax()的特点是什么（和$.get()、$.post()的区别是什么）？
一句话总结：$.ajax([settings])settings可选。用于配置Ajax请求的键值对集合。
1、$.ajax()的特点是什么（和$.get()、$.post()的区别是什么）？
$.get,$.post为$.ajax()的封装
2、$.ajax()方法的参数是什么形式？
键值对
- 语法：$.ajax([settings])settings可选。用于配置Ajax请求的键值对集合。
参数
- 第一个参数是我们希望请求的URL;
- 第二个参数是回调函数。第一个回调参数存有被请求页面的内容，第二个回调参数存有请求的状态。
- 常用参数：
- url默认值：当前页地址。发送请求的地址。
- type请求方式(“POST”或”GET”),默认为”GET”。
- Success类型：Function请求成功后的回调函数。
- error请求失败时调用此函数。
- .........
16 <script type="text/javascript">
17 $(function(){
18 $('#btn').click(function(){
19 $.ajax({
20 type:'POST', //默认为GET方式提交
21 url:'testPost0.php',
22 data:{password:'123456'},
23 success:function(responseTxt,statusTxt,xhr){
24 alert(responseTxt)
25 },
26 error:function(){
27 alert('加载失败')
28 }
29 })
30 })
31 })
32 </script>
二、$.ajax()方法如何使用1、相关知识
$.ajax()
$.ajax()方法是jQuery底层AJAX实现。之前讲的简单易用的$.get,$.post 等为高层实现见。$.ajax()返回其创建的XMLHttpRequest 对象。大多数情况下我们无需直接操作该函数。除非你需要操作不常用的选项，以获得更多的灵活性。
- 语法：$.ajax([settings])settings可选。用于配置Ajax请求的键值对集合。
参数
- 第一个参数是我们希望请求的URL;
- 第二个参数是回调函数。第一个回调参数存有被请求页面的内容，第二个回调参数存有请求的状态。
- 常用参数：
- url默认值：当前页地址。发送请求的地址。
- type请求方式(“POST”或”GET”),默认为”GET”。
- Success类型：Function请求成功后的回调函数。
- error请求失败时调用此函数。
- .........
2、代码
<!DOCTYPE html>
<html lang="en">
<style>
</style>
<head>
<meta charset="UTF-8">
<title>演示文档</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<style type="text/css">
</style>
</style>
</head>
<body>
<input type="button" id="btn" value="Ajax测试">
<div id="test"></div>
<script type="text/javascript">
$(function(){
$('#btn').click(function(){
$.ajax({
type:'POST', //默认为GET方式提交
url:'testPost0.php',
data:{password:'123456'},
success:function(responseTxt,statusTxt,xhr){
alert(responseTxt)
},
error:function(){
alert('加载失败')
}
})
})
})
</script>
</body>
</html>
