1.認識JQ中ajax的封裝 jQ 對於ajax的封裝有兩層實現；$.ajax 為底層封裝實現；基於 $.ajax ，分別實現了$.get 與$.post 的高層封裝實現； 2.Ajax的底層實現基本語法： async： 布爾類型，代表是否非同步，true代表非同步，false同步，預設為true ca ...
1.認識JQ中ajax的封裝
jQ 對於ajax的封裝有兩層實現；$.ajax 為底層封裝實現；基於 $.ajax ，分別實現了$.get 與$.post 的高層封裝實現；
2.Ajax的底層實現基本語法：
GET請求
<body>
<input type="button" value="點擊" id="btu">
</body>
<script>
$('#btu').click(function(){
//get請求
$.ajax({
url:'/jq_ajax_get',
success:function(data){
alert(data);
}
});
});
</script>
POST請求：
<body>
<input type="button" value="點擊" id="btu">
</body>
<script>
$('#btu').click(function () {
$.ajax({
url: '/jq_ajax_post',
type: 'post',
data: 'id=1111',
success: function (data) {
alert(data);
},
// async:false,
});
// alert(22); //檢驗同步非同步
});
</script>
3.ajax的高層實現：
GET應用：
url:待載入頁面的URL地址
data:待發送 Key/value 參數。
callback:載入成功時回調函數。
type:返回內容格式，xml, html, script, json, text, _default。
案例：
<body>
<input type="button" value="點擊" id="btu">
</body>
<script>
$('#btu').click(function(){
$.get('/jq_ajax_get',function(data){
alert(data);
},'json');
});
</script>
POST應用：
<body>
<input type="button" value="點擊" id="btu">
</body>
<script>
$('#btu').click(function () {
$.post('/jq_ajax_post',
{ id: '11' },
function (data) {
alert(data);
});
});
</script>
