个人中心
gpt4 book ai didi

beego获取ajax数据的实例

转载 作者：qq735679552 更新时间：2022-09-29 22:32:09 25 4
gpt4 key购买 nike

CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界.

这篇CFSDN的博客文章beego获取ajax数据的实例由作者收集整理，如果你对这篇文章有兴趣，记得点赞哟.

1. 什么是AJAX 。

Asynchronous JavaScript And XML（异步 JavaScript 及 XML），是指一种创建交互式网页应用的网页开发技术 。

Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术.

2. 如何使用 AJAX 。

XMLHttpRequest 是 AJAX 的基础.

XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新.

使用AJAX大致分四步 。

1. 创建XMLHttpRequest 对象 。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
//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每次发生变化时调用该回调函数） 。

?
1
2
3
4
5
6
7
//当xhr.readyState == 4时所有的步骤都已执行完毕
//当xhr.state == 200时表示已经正确执行
  xhr.onreadystatechange=function(){
   if(xhr.readyState == 4 && xhr.state == 200){
     alter("请求已全部执行，并且成功");
   }
}

3.建立与服务器的异步连接（默认为异步） 。

?
1
2
3
4
5
6
7
8
9
/**
  open(method,url,async)方法
  规定请求的类型、URL 以及是否异步处理请求。
  method：请求的类型；GET 或 POST
  url：相求处理请求的url
  async：true（异步）或 false（同步）
  通过time来保证，每次发送新的请求
*/
xhr.open("Post", "/detailsU?time=" + new Date().getTime());

4.发出异步请求 。

?
1
2
3
4
/**
  send方法中发送json格式的字符串
*/
xhr.send('{"Index":"'+index +'", "Change":"' + i +'"}');

通过以上四步就可以成功的发送请求了 。

附源码:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
{{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("请输入调整的库存大小：");
           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中创建数据的结构 。

?
1
2
3
4
5
6
7
8
/**
  要与传过来的json格式字符串对应
  '{"Index":"'+index +'", "Change":"' + i +'"}'
*/
type Object struct {
  Index string
  Change string
}

2. 注册相应的路由 。

?
1
2
3
4
5
6
/**
  在main.go当中注册相应的路由（注意与对应路由设置好）
  xhr.open("Post", "/detailsU?time=" + new Date().getTime());
  "Post:DoUpdate"用来注册当Post方法请求该URL处理的函数
*/
beego.Router("/detailsU", &controllers.DetailController{}, "Post:DoUpdate")

3. 在controller中写好相应的处理函数 。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
/**
  在对应的函数中处理相应的请求
  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数据的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我.

原文链接：http://blog.csdn.net/s_842499467/article/details/78831800 。

最后此篇关于beego获取ajax数据的实例的文章就讲到这里了,如果你想了解更多关于beego获取ajax数据的实例的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！ 。

25 4 0
文章推荐： golang对自定义类型进行排序的解决方法
文章推荐： golang常用手册之切片(Slice)原理
文章推荐： Ruby生成随机数的方法总结
文章推荐： 最新的CocoaPods安装教程
qq735679552
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com