ajax请求的时候同时刷新中奖表单

最新推荐文章于 2021-08-05 17:10:46 发布

Anliexo

最新推荐文章于 2021-08-05 17:10:46 发布

阅读量294

点赞数

CC 4.0 BY-SA版权

分类专栏：项目 JavaScript 框架文章标签： jquery ajax

本文链接：https://blog.youkuaiyun.com/qq_35733535/article/details/80108323

项目同时被 3 个专栏收录

71 篇文章

订阅专栏

框架

35 篇文章

订阅专栏

JavaScript

5 篇文章

订阅专栏

本文介绍了一个使用Ajax刷新用户中奖信息的需求实现方案。通过后台返回的JSON数据，在前端利用jQuery进行DOM操作，将中奖用户的微信昵称及所获奖品名称展示在指定的HTML元素中。奖品分为实体奖和现金奖两类。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这是开发中遇到的一个问题，当ajax刷新用户中奖信息的时候同时传递list需要前台遍历以后在alter的页面显示实时的中奖信息，这是需求。

       $.ajax({
        type: "post",
        url: "请求方法/myPrize",
        async: true,
        dataType: "json",
        data: {
           需要传递的值
        },
        success: function (data) {
                var tt = data.li;
                for (var i = 0; i < tt.length; i++) {
                    for (i in tt) {
                        console.log(tt.length + "=====");
                        $("<li>" + tt[i].wechat_nickname + "   抽中了   " + tt[i].prize_name + "</li>").appendTo($(".records-list"));
                    }
                }

                var yy = data.lis;
                for (var j = 0; j < yy.length; j++) {
                    for (j in yy) {
                        console.log(yy.length + "=====");
                        $("<li>" + yy[j].wechat_nickname + "    抽中了   " + yy[j].total_amount + " 元现金红包" + "</li>").appendTo($(".records-list"));
                    }
                }

            }

        }


    });

这里需要说明的是奖品来源于两个表，有实体奖和现金奖品，html是这个样子的

<div class="prize-record zoomIn">
    <div class="top">
        <span>您的中奖记录</span>
    </div>
    <div class="bottom">
        <ul class="records-list">
         
        </ul>

        <button class="btn">关闭</button>
    </div>
</div>

其实就是一个后台的list在js中for循环遍历出来然后appendTo到指定位置