ajax請求完畢之前顯示正在載入程式碼例項
本章節介紹一個ajax請求中比較常見的效果。
通常情況下如何要在一個版塊通過ajax方式載入遠端內容的時候,通常在載入完畢之前會給出一定的提示效果,使用者一看就知道,有內容正在載入中,而不是任務網頁存在故障或者說就是沒有任何,下面就通過程式碼例項介紹一下如何實現此效果。
程式碼例項:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $.ajax({ url:"demo/ajax/net/Async.aspx", async:true, beforeSend:function(){ $('#show').html('<img src="demo/ajax/net/img/wait.gif">'); }, success:function(data){ $("#show").html(data); } }) }); </script> </head> <body> <div id="show"></div> </body> </html>
上面你的程式碼實現了我們的要求,在ajax請求完成之前,div中會顯示一個旋轉載入等待圖片。
相關文章
- canvas載入效果程式碼例項Canvas
- 如何在請求資料時,顯示載入動畫動畫
- jQuery控制div顯示和隱藏程式碼例項jQuery
- django搭建完畢執行顯示hello djangoDjango
- ajax請求
- ajax請求下載excel檔案Excel
- dubbo請求報文例項
- PHP+Ajax點選載入更多列表資料例項PHP
- ajax請求 juery
- ajax讀取資料庫資料程式碼例項資料庫
- JavaScript判斷iframe是否載入完畢JavaScript
- springboot中執行完某些邏輯後,才算bean載入完,applicationContext才載入完畢Spring BootBeanAPPContext
- 原生ajax請求&JSONPJSON
- 不能顯式攔截ajax請求的302響應?
- android 網路請求時,顯示progrossBarAndroidROS
- springmvc處理ajax請求SpringMVC
- 封裝ajax、axios請求封裝iOS
- longing載入中例項
- Ajax程式碼執行前應該先載入jQueryjQuery
- jQuery Ajax 例項 全解析jQuery
- Nacos - 服務端處理例項列表請求服務端
- axios模擬GET請求例項及詳解iOS
- Python爬蟲(5-10)-編解碼、ajax的get請求、ajax的post請求、URLError/HTTPError、微博的cookie登入、Handler處理器Python爬蟲ErrorHTTPCookie
- ajax請求servlet返回資料Servlet
- KKB : Jquery實現Ajax請求jQuery
- 如何傳送請求以及AJAX
- Ajax請求後臺資料
- ajax中POST請求與引數(請求體)設定
- ajax中設定請求頭和自定義請求頭
- restful風格請求,基於token鑑權例項REST
- QT OPENGL 與 shader 繪製展示視訊程式碼例項 OPenGL直接顯示YUV資料QT
- 對於動態載入內容 (包括 Ajax 請求內容) 繫結點選事件事件
- http 請求-01-AJAX(Asynchronous JavaScript and XML)入門介紹, ajax 的優缺點HTTPJavaScriptXML
- vue2.0 axios post請求傳參問題(ajax請求)VueiOS
- jquery Ajax 請求錯誤 Unexpected tokenjQuery
- 利用fetch方法實現Ajax請求
- 基於jq封裝ajax請求封裝
- Flutter 例項 - 載入更多的ListViewFlutterView
- dom操作程式碼例項