1. 什么是AJAX
Asynchronous JavaScript And XML（異步 JavaScript 及 XML），是指一種創建交互式網頁應用的網頁開發技術
Ajax 是一種在無需重新加載整個網頁的情況下，能夠更新部分網頁的技術。
2. 如何使用 AJAX
XMLHttpRequest 是 AJAX 的基礎。
XMLHttpRequest 用于在后臺與服務器交換數據。這意味著可以在不重新加載整個網頁的情況下，對網頁的某部分進行更新。
使用AJAX大致分四步
1. 創建XMLHttpRequest 對象
//js代碼獲取XMLHttpRequest 對象（保存為util.js）function getXmlHttpRequest() { var xhr; try { // Firefox, Opera 8.0+, Safari xhr = new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("您的瀏覽器不支持AJAX！"); return false; } } } return xhr;}2.注冊狀態回調函數（當XMLHttpRequest 對象的readyState每次發生變化時調用該回調函數）
//當xhr.readyState == 4時所有的步驟都已執行完畢//當xhr.state == 200時表示已經正確執行 xhr.onreadystatechange=function(){ if(xhr.readyState == 4 && xhr.state == 200){ alter("請求已全部執行，并且成功"); }}3.建立與服務器的異步連接（默認為異步）
/** open(method,url,async)方法 規定請求的類型、URL 以及是否異步處理請求。 method：請求的類型；GET 或 POST url：相求處理請求的url async：true（異步）或 false（同步） 通過time來保證，每次發送新的請求*/xhr.open("Post", "/detailsU?time=" + new Date().getTime());4.發出異步請求
/** send方法中發送json格式的字符串*/xhr.send('{"Index":"'+index +'", "Change":"' + i +'"}');通過以上四步就可以成功的發送請求了
附源碼：
{{range .PhoneDetails}} <tr onclick="func1(this)"> <th>{{.Id}}</th> <th>{{.Name}}</th> <th>{{.Price}}</th> <th>{{.Repertory}}</th> <th> <a href="">編輯 </th> <script type="text/javascript" src="/static/js/util.js"></script> <script type="text/javascript"> function func1(x) { var code = prompt("請輸入調整的庫存大?。?quot;); if(code != null && code != "") { var i = parseInt(code); if(isNaN(i)) { alert('輸入錯誤'); } else { var xhr = getXmlHttpRequest(); xhr.onreadystatechange = function() { if(xhr.readyState == 4 && xhr.state == 200) { alter("請求已全部執行，并且成功"); } } var index = x.rowIndex; xhr.open("Post", "/detailsU?time=" + new Date().getTime()); xhr.send('{"Index":"' + index + '", "Change":"' + i + '"}'); alert('修改成功'); } } else { alert('輸入錯誤'); } } </script> </tr> {{end}}3. 在beego中處理AJAX的請求
1. 首先在models層的models.go中創建數據的結構
/** 要與傳過來的json格式字符串對應 '{"Index":"'+index +'", "Change":"' + i +'"}'*/type Object struct { Index string Change string}2. 注冊相應的路由
/** 在main.go當中注冊相應的路由（注意與對應路由設置好） xhr.open("Post", "/detailsU?time=" + new Date().getTime()); "Post:DoUpdate"用來注冊當Post方法請求該URL處理的函數*/beego.Router("/detailsU", &controllers.DetailController{}, "Post:DoUpdate")3. 在controller中寫好相應的處理函數
/** 在對應的函數中處理相應的請求 json.Unmarshal(this.Ctx.Input.RequestBody, ob) 通過json來解析穿過來的數據，并將數據存儲在ob對象中 在app.conf中設置copyrequestbody = true*/func (this *DetailController) DoUpdate(){ ob := &models.Object{} json.Unmarshal(this.Ctx.Input.RequestBody, ob) db, err := sql.Open("mysql", "用戶名:密碼@tcp(IP:3306)/數據庫名") result, err := db.Exec("UPDATE 數據表名 SET 字段= ? WHERE id = ?",ob.Change, ob.Index) if err != nil{ beego.Error(err) return }else{ fmt.Println(result) }}以上這篇beego獲取ajax數據的實例就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持VEVB武林網。
新聞熱點
疑難解答
