jq_get方法
(1)jQuery.get(url,[data],[callback],[type])
通过远程 HTTP GET 请求载入信息。
这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用 $.ajax。
(2)参数
url:待载入页面的URL地址
data:待发送 Key/value 参数。
callback:载入成功时回调函数。
type:返回内容格式，xml, html, script, json, text, _default。
参数顺序时刻以更换，如果data放到后面会出现无法传递数据的问题
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="button" value="测试jq_get方法" id="jqGet">
</body>
</html>
<!-- 导入 -->
<script type="text/javascript" src="../js/template-native.js"></script>
<!-- 写自己代码 -->
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
/*参数一：事件名字不加on
参数二：绑定的函数*/
$("#jqGet").on('click',function(){+
//使用get发送ajax-参数1：url-参数2：回调函数 -参数3：支持直接写js对象-参数4：从服务器端获取的内容可以不写，如果写为json，jq内部会进行json.parse()转化
$.get('01.jq_get.php',{name:"jack",age:18},function(data){
console.log(data);
console.log(data.name);
console.log(data.color);
},'json');
})
})
</script>
PHP
<?php
echo '{"name":"西兰花","color":"绿油油"}';
?>
jq_post方法（同上）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h1>测试post方法</h1>
<input type="button" value="测试Post" id='jqPost'>
</body>
</html>
<script type="text/javascript" src='../js/jquery.min.js'></script>
<script type="text/javascript">
$(function(){
$("#jqPost").click(function(){
$.post('02.jq_post.php',{name:"榴莲炒饭",skill:"熏人"},function(data){
console.log(data);
console.log(data.name);
console.log(data.skill);
},'json');
})
})
</script>
.<?php
echo '{"name":"榴莲排骨汤","skill":"'.$_POST['skill'].'"}';
?>
jq_ajax方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h1>测试jq_ajax方法</h1>
<input type="button" value="测试ajax方法" id='jqAjax'>
</body>
</html>
<script type="text/javascript" src='../js/jquery.min.js'></script>
<script type="text/javascript">
$(function () {
// 绑定点击事件
$("#jqAjax").on('click',function () {
// 使用jq 发送ajax
/*
常见参数:
url:请求的地址
success:请求成功的回调函数
type:不写是get 可以指定 get,post
dataType:数据的类型
data:发数据 可以写js对象
beforeSend:发送之前调用的匿名函数
可以return false 阻止该次请求
验证用户的数据 是否填了
error:请求失败以后 会调用
*/
$.ajax({
url:'03.jq_ajax.php',
success:function(data){
console.log(data);
},
type:'post',
dataType:'json',
data:{'name':"干锅花菜","skill":"上天"},
beforeSend:function(){
console.log('发送之前调用');
return false;
},
error:function(){
console.log('请求失败了');
}
});
});
})
</script>