标签随机颜色的展示

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
37
//调用热门标签的列表接口
       $.ajax({
           url: getv1 + '/index/tag/hotTags',
           type: 'GET',
           dataType: 'json',
           data: { inscode: jxinscode },
           success: function(res) {
               var labellen = res.data.length;
               if (labellen > 0) {
                   var lalist = "";
                   for (var i = 0; i < labellen; i++) {
                       var laname = res.data[i].name; //标签名称
                       var latimes = res.data[i].times; //标签使用次数
                       lalist += '<span class="label">' + laname + '<span>(' + latimes + ')</span></span>';
 
                   }
                   $(".labellist").append(lalist);
                   //标签颜色随机显示
                   var labelindex = $(".label").length;
                   var colorList = ["#9dc6eb", "#f8c471", "#b9a3ef", "#fdb1ca", "#9dc6eb", "#f8c471", "#b9a3ef", "#fdb1ca"];
                   for (var i = 0; i < labelindex; i++) {
                       var bgColor = getColorByRandom(colorList);
                       $(".label").eq(i).css("background", bgColor);
                   }
 
                   function getColorByRandom(colorList) {
                       var colorIndex = Math.floor(Math.random() * colorList.length);
                       var color = colorList[colorIndex];
                       colorList.splice(colorIndex, 1);
                       return color;
                   }
               }
           },
           error: function(res) {
 
           }
       });

  

posted @   星期九  阅读(834)  评论(0编辑  收藏  举报
编辑推荐:
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 现代计算机视觉入门之:什么是图片特征编码
· .NET 9 new features-C#13新的锁类型和语义
· Linux系统下SQL Server数据库镜像配置全流程详解
· 现代计算机视觉入门之:什么是视频
阅读排行:
· Sdcb Chats 技术博客:数据库 ID 选型的曲折之路 - 从 Guid 到自增 ID,再到
· .NET Core GC压缩(compact_phase)底层原理浅谈
· Winform-耗时操作导致界面渲染滞后
· Phi小模型开发教程:C#使用本地模型Phi视觉模型分析图像,实现图片分类、搜索等功能
· 深度学习基础理论————CV中常用Backbone(Resnet/Unet/Vit系列/多模态系列等
点击右上角即可分享
微信分享提示