beego獲取ajax數(shù)據(jù)的實(shí)例

1. 什么是AJAX

成都創(chuàng)新互聯(lián)技術(shù)團(tuán)隊(duì)十多年來(lái)致力于為客戶(hù)提供網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、品牌網(wǎng)站設(shè)計(jì)、營(yíng)銷(xiāo)型網(wǎng)站建設(shè)、搜索引擎SEO優(yōu)化等服務(wù)。經(jīng)過(guò)多年發(fā)展，公司擁有經(jīng)驗(yàn)豐富的技術(shù)團(tuán)隊(duì)，先后服務(wù)、推廣了千余家網(wǎng)站，包括各類(lèi)中小企業(yè)、企事單位、高校等機(jī)構(gòu)單位。

Asynchronous JavaScript And XML（異步 JavaScript 及 XML），是指一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開(kāi)發(fā)技術(shù)

Ajax 是一種在無(wú)需重新加載整個(gè)網(wǎng)頁(yè)的情況下，能夠更新部分網(wǎng)頁(yè)的技術(shù)。

2. 如何使用 AJAX

XMLHttpRequest 是 AJAX 的基礎(chǔ)。

XMLHttpRequest 用于在后臺(tái)與服務(wù)器交換數(shù)據(jù)。這意味著可以在不重新加載整個(gè)網(wǎng)頁(yè)的情況下，對(duì)網(wǎng)頁(yè)的某部分進(jìn)行更新。

使用AJAX大致分四步

1. 創(chuàng)建XMLHttpRequest 對(duì)象

//js代碼獲取XMLHttpRequest 對(duì)象（保存為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.注冊(cè)狀態(tài)回調(diào)函數(shù)（當(dāng)XMLHttpRequest 對(duì)象的readyState每次發(fā)生變化時(shí)調(diào)用該回調(diào)函數(shù)）

//當(dāng)xhr.readyState == 4時(shí)所有的步驟都已執(zhí)行完畢
//當(dāng)xhr.state == 200時(shí)表示已經(jīng)正確執(zhí)行
 xhr.onreadystatechange=function(){
  if(xhr.readyState == 4 && xhr.state == 200){
    alter("請(qǐng)求已全部執(zhí)行，并且成功");
  }
}

3.建立與服務(wù)器的異步連接（默認(rèn)為異步）

/**
 open(method,url,async)方法
 規(guī)定請(qǐng)求的類(lèi)型、URL 以及是否異步處理請(qǐng)求。
 method：請(qǐng)求的類(lèi)型；GET 或 POST
 url：相求處理請(qǐng)求的url
 async：true（異步）或 false（同步）
 通過(guò)time來(lái)保證，每次發(fā)送新的請(qǐng)求
*/
xhr.open("Post", "/detailsU?time=" + new Date().getTime());

4.發(fā)出異步請(qǐng)求

/**
 send方法中發(fā)送json格式的字符串
*/
xhr.send('{"Index":"'+index +'", "Change":"' + i +'"}');

通過(guò)以上四步就可以成功的發(fā)送請(qǐng)求了

附源碼：

{{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("請(qǐng)輸入調(diào)整的庫(kù)存大小：");
          if(code != null && code != "") {
            var i = parseInt(code);
            if(isNaN(i)) {
              alert('輸入錯(cuò)誤');
            } else {
              var xhr = getXmlHttpRequest();
              xhr.onreadystatechange = function() {
                if(xhr.readyState == 4 && xhr.state == 200) {
                  alter("請(qǐng)求已全部執(zhí)行，并且成功");
                }
              }
              var index = x.rowIndex;
              xhr.open("Post", "/detailsU?time=" + new Date().getTime());
              xhr.send('{"Index":"' + index + '", "Change":"' + i + '"}');
              alert('修改成功');
            }
          } else {
            alert('輸入錯(cuò)誤');
          }
        }
      </script>
    </tr>
    {{end}}

3. 在beego中處理AJAX的請(qǐng)求

1. 首先在models層的models.go中創(chuàng)建數(shù)據(jù)的結(jié)構(gòu)

/**
 要與傳過(guò)來(lái)的json格式字符串對(duì)應(yīng)
 '{"Index":"'+index +'", "Change":"' + i +'"}'
*/
type Object struct {
 Index string
 Change string
}

2. 注冊(cè)相應(yīng)的路由

/**
 在main.go當(dāng)中注冊(cè)相應(yīng)的路由（注意與對(duì)應(yīng)路由設(shè)置好）
 xhr.open("Post", "/detailsU?time=" + new Date().getTime());
 "Post:DoUpdate"用來(lái)注冊(cè)當(dāng)Post方法請(qǐng)求該URL處理的函數(shù)
*/
beego.Router("/detailsU", &controllers.DetailController{}, "Post:DoUpdate")

3. 在controller中寫(xiě)好相應(yīng)的處理函數(shù)

/**
 在對(duì)應(yīng)的函數(shù)中處理相應(yīng)的請(qǐng)求
 json.Unmarshal(this.Ctx.Input.RequestBody, ob)
 通過(guò)json來(lái)解析穿過(guò)來(lái)的數(shù)據(jù)，并將數(shù)據(jù)存儲(chǔ)在ob對(duì)象中
 在app.conf中設(shè)置copyrequestbody = true
*/
func (this *DetailController) DoUpdate(){
    ob := &models.Object{}
    json.Unmarshal(this.Ctx.Input.RequestBody, ob)
    db, err := sql.Open("MySQL", "用戶(hù)名:密碼@tcp(IP:3306)/數(shù)據(jù)庫(kù)名")
    result, err := db.Exec("UPDATE 數(shù)據(jù)表名 SET 字段= ? WHERE id = ?",ob.Change, ob.Index)
    if err != nil{
      beego.Error(err)
      return
    }else{
       fmt.Println(result)
    }
}

以上這篇beego獲取ajax數(shù)據(jù)的實(shí)例就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持創(chuàng)新互聯(lián)。

名稱(chēng)欄目：beego獲取ajax數(shù)據(jù)的實(shí)例
當(dāng)前網(wǎng)址：http://www.chinadenli.net/article40/ishsho.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供用戶(hù)體驗(yàn)、ChatGPT、網(wǎng)站設(shè)計(jì)公司、靜態(tài)網(wǎng)站、App開(kāi)發(fā)、網(wǎng)站導(dǎo)航

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

beego獲取ajax數(shù)據(jù)的實(shí)例