摘要:作者后臺使用的是語言,所以這里以后臺為例子不影響學習一原生使用方法創建對象兼容處理處理低版本不兼容問題準備發送請求方式接口參數名參數值異步執行發送回調是表示數據解析完成,后臺處理完成了。是表示處理的結果是的。
作者后臺使用的是php語言,所以這里以php后臺Api為例子,不影響學習Ajax一、 javaScript原生使用Ajax 1.get方法
//1.創建對象 兼容處理 var xhr = null; //處理低版本IE不兼容問題 if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject("Microsoft.XMLHTTP"); } //2.準備發送 請求方式 接口 參數名 參數值 異步 xhr.open("get","xxx.php?username=" + usernameValue ,true); //3.執行發送 xhr.send(null); //4.回調 xhr.onreadystatechange = function () { /*xhr.readyState == 4 是表示數據解析完成,后臺處理完成了。 xhr.status == 200 是表示處理的結果是OK的。響應成功*/ if (xhr.readyState == 4){ if(xhr.status == 200){ //返回結果 var result = xhr.responseText; console.log(result); } } };2.post方法
//#1.創建對象 兼容性 var xhr = null; //處理低版本IE不兼容問題 if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject("Microsoft.XMLHTTP") } //#2.準備發送 xhr.open("post","xxx.php",true); // 參數 var param = "phone=" + phoneValue; //設置響應頭 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //#3.執行發送 xhr.send(param); //#4.回調函數 xhr.onreadystatechange = function () { if(xhr.readyState == 4){ if(xhr.status ==200){ var result = xhr.responseText; console.log(result); } } }
open()方法后面的參數true和false,表示異步和同步,同步(false)就是先吃完飯才能看電視,異步(true)就是邊吃飯邊看電視**二、 jQuery中的使用Ajax 1.基本使用方法
$.ajax({ url: "xxx.php", type: "get", beforeSend: function(xhr){ console.log(xhr); }, success: function (res) { console.log(res); }, error:function (xhr) { console.log(xhr); }, complete:function (xhr) { console.log(xhr); } });
post方式只需把type值改成 get就行
2.快捷方式$.get("xxx.php",{id:1},function (res) { console.log(res); }); $.post("xxx.php",{id:1},function (res) { console.log(res); });
以上是get和post兩種方式3.解析Json格式
$.getJSON("xxx.php",{id:1},function (res) { console.log(res); });
或者在放置json格式文件的php中進行申明頭部
"張三", "age" => 18 ); //格式 header("Content-Type:application/json"); echo json_encode($zhangsan); ?>
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/103731.html
摘要:原生與對的實現一定義里這么解釋異步的和。二原生實現所有現代瀏覽器以及均內建對象。一般是正常未找到頁面,一般是錯誤,或者后臺沒有創建相應的內部服務錯誤,多為后臺錯誤?;旧贤ㄟ^發送的數據及傳回的數據就能定位問題所在了。 原生JS與jQuery對AJAX的實現 一、定義 W3C里這么解釋AJAX: AJAX = Asynchronous JavaScript and XML(異步的 Jav...
摘要:在這里講解一下用原生如何實現。當然,前面也說過,你可以給定固定回調函數名最后我已經將和請求合并在一起了,下載鏈接原文鏈接原生實現如有問題,歡迎在下方留言 相信大多數前端開發者在需要與后端進行數據交互時,為了方便快捷,都會選擇JQuery中封裝的AJAX方法,但是有些時候,我們只需要JQuery的AJAX請求方法,而其他的功能用到的很少,這顯然是沒必要的。 其實,原生JavaScript...
摘要:本文詳細講述如何使用原生和來實現。使用可以無刷新地向服務端發送請求接收服務端響應,并更新頁面。分別要用到的方法和方法。,,都是現在和未來解決異步的標準做法,可以完美搭配使用。這也是使用標準一大好處。 本文詳細講述如何使用原生 JS、jQuery 和 Fetch 來實現 AJAX。 AJAX 即 Asynchronous JavaScript and XML,異步的 JavaScript...
閱讀 1845·2021-08-19 11:12
閱讀 1422·2021-07-25 21:37
閱讀 985·2019-08-30 14:07
閱讀 1264·2019-08-30 13:12
閱讀 649·2019-08-30 11:00
閱讀 3526·2019-08-29 16:28
閱讀 987·2019-08-29 15:33
閱讀 2965·2019-08-26 13:40