您好,登錄后才能下訂單哦!
本篇文章展示了ajax實現請求的具體操作,代碼簡明扼要容易理解,絕對能讓你眼前一亮,通過這篇文章的詳細介紹希望你能有所收獲。
Ajax(Asynchronous JavaScript and XML),直譯為“異步的JavaScript與XML技術”,是一種創建交互式網頁應用的網頁開發技術,用于創建快速動態網頁,由杰西·詹姆士·賈瑞特所提出。與傳統的Web應用相比,Ajax通過瀏覽器與服務器進行少量的數據交換就可以實現網頁的異步更新,在不重新加載整個網頁的情況下,即可對網頁進行更新。
第一步,創建XMLHttpRequest對象
第二步,注冊回調函數
第三步,配置請求信息,open(),get
第四步,發送請求,post請求下,要傳遞的參數放這
第五步,創建回調函數
//第一步,創建XMLHttpRequest對象 var xmlHttp = new XMLHttpRequest(); function CommentAll() { //第二步,注冊回調函數 xmlHttp.onreadystatechange =callback1; //{ // if (xmlHttp.readyState == 4) // if (xmlHttp.status == 200) { // var responseText = xmlHttp.responseText; // } //} //第三步,配置請求信息,open(),get //get請求下參數加在url后,.ashx?methodName = GetAllComment&str1=str1&str2=str2 xmlHttp.open("post", "/ashx/myzhuye/Detail.ashx?methodName=GetAllComment", true); //post請求下需要配置請求頭信息 //xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //第四步,發送請求,post請求下,要傳遞的參數放這 xmlHttp.send("methodName = GetAllComment&str1=str1&str2=str2");//" } //第五步,創建回調函數 function callback1() { if (xmlHttp.readyState == 4) if (xmlHttp.status == 200) { //取得返回的數據 var data = xmlHttp.responseText; //json字符串轉為json格式 data = eval(data); $.each(data, function(i, v) { alert(v); }); } }
后臺方法
private void GetAllComment(HttpContext context) { //Params可以取得get與post方式傳遞過來的值。 string methodName = context.Request.Params["methodName"]; //QueryString只能取得get方式傳遞過來的值。 string str1 = context.Request.Form["str1"]; //取得httpRequest傳來的值,包括get與post方式 string str2 = context.Request["str2"]; List<string> comments = new List<string>(); comments.Add(methodName); comments.Add(str1); comments.Add(str2); //ajax接受的是json類型,需要把返回的數據轉給json格式 string commentsJson = new JavaScriptSerializer().Serialize(comments); context.Response.Write(commentsJson); }
擴展知識:
Ajax的優缺點
使用Ajax的最大優點,就是能在不更新整個頁面的前提下維護數據。這使得Web應用程序更為迅捷地回應用戶動作,并避免了在網絡上發送那些沒有改變的信息。
Ajax不需要任何瀏覽器插件,但需要用戶允許JavaScript在瀏覽器上執行。就像DHTML應用程序那樣,Ajax應用程序必須在眾多不同的瀏覽器和平臺上經過嚴格的測試。隨著Ajax的成熟,一些簡化Ajax使用方法的程序庫也相繼問世。同樣,也出現了另一種輔助程序設計的技術,為那些不支持JavaScript的用戶提供替代功能。
對應用Ajax最主要的批評就是,它可能破壞瀏覽器的后退與加入收藏書簽功能。在動態更新頁面的情況下,用戶無法回到前一個頁面狀態,這是因為瀏覽器僅能記下歷史記錄中的靜態頁面。一個被完整讀入的頁面與一個已經被動態修改過的頁面之間的可能差別非常微妙;用戶通常都希望單擊后退按鈕,就能夠取消他們的前一次操作,但是在Ajax應用程序中,卻無法這樣做。不過開發者已想出了種種辦法來解決這個問題,HTML5之前的方法大多是在用戶單擊后退按鈕訪問歷史記錄時,通過創建或使用一個隱藏的IFRAME來重現頁面上的變更。(例如,當用戶在Google Maps中單擊后退時,它在一個隱藏的IFRAME中進行搜索,然后將搜索結果反映到Ajax元素上,以便將應用程序狀態恢復到當時的狀態)。
看完上述內容,你們掌握ajax實現請求的方法了嗎?如果還想學到更多技能或想了解更多相關內容,歡迎關注億速云行業資訊頻道,感謝各位的閱讀!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。