js根据数据条数，使表格每一行只显示三条数据，最后一行显示多余的数据。

逃离我推掉我的手 2022-04-10 02:09 148阅读 0赞

个人思路，仅供参考！

function show_spots_table(result) {
            //清空table表格
            var spots = result.extend.pageInfo;
            var len = count(spots);
            var s = "";
            var s1 ="";
            var i = 1;
            $.each(spots, function (index, item) {
                var scenicSpotName = $("<p></p>").addClass("pos-abs").append(item.scenicSpotName);
                var html = "<img src='" + item.pictureOne + "' style='width: 400px' height='240px'>";
                var a = $("<a href='#'></a>").append(html).append(scenicSpotName);
                var b = $("<div data-module-name='c_fimg_t_0' style='zoom: 1;float: left;'></div>").addClass("slider-main-img").append(a);
                var c = $("<div></div>").addClass("spot").append(b);
                var t = $("<td></td>").append(c);
                debugger;
                if(((i%3==0) && (i!=0)) || ((i%3!=0)&&(index==len-1))){
                    s=s+"<td>"+t[0].innerHTML+"</td>";
                    var t1 = $("<tr></tr>").append(s);
                    s1 = s1+"<tr>"+t1[0].innerHTML+"</tr>";
                    $("#tableImg1 tbody").append(s1);
                    s="";
                    t1="";
                    s1="";
                    i=i+1;
                }
                else{
                    s=s+"<td>"+t[0].innerHTML+"</td>";
                    i=i+1;
                }
            });
        };

解释一下：result是我从数据库中返回的json数据

我是手动用js向html添加标签。

另外写了一个计算数组对象长度的函数

function count(o){
            var t = typeof o;
            if(t == 'string'){
                return o.length;
            }else if(t == 'object'){
                var n = 0;
                for(var i in o){
                    n++;
                }
                return n;
            }
            return false;
        }

命名没有按照规范！不要在意。。。

解决问题的办法有很多种，这只是其中一种思路，仅供参考，大神勿喷。

发表评论取消回复

表情：

评论列表（有 0 条评论，148人围观）

还没有评论，来说两句吧...

相关阅读

相关 elementUI如何获取table 表格中的数据行数据和每一行的id

表格中有操作按钮的话，获取当前勾选行的数据，大家都知道用slot-scope="scope" 来获取，但如果要实现的功能是在表头上了，那要怎么获取当前前勾选的这一行的数据呢？这

待我称王封你为后i/ 2024年03月26日 12:47/ 0 赞/ 23 阅读

相关 jQuery数据渲染，每行显示4个数据，超过四条数据自动换行

[{"name":"体验区统计","numb":0},{"name":"test909","numb":0},{"name":"test910","numb":0},{

快来打我*/ 2022年12月17日 01:23/ 0 赞/ 122 阅读

相关 mongodb 取出第一条最后一条数据

前言比如说数据库本来有这些数据： ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aH

Myth丶恋晨/ 2022年12月15日 12:45/ 0 赞/ 217 阅读

相关 MySQL一对多数据显示成一行

三张表 user(用户),role(角色),user\_role(用户角色关联) 查询出用户的多个角色显示成一行 SELECT a.id,

港控/mmm°/ 2022年10月16日 08:43/ 0 赞/ 218 阅读

相关轮播一页显示多少条数据

// arr 展示swiper的数组 // size 每页展示数据的个数 swiper(arr, size) {

缺乏、安全感/ 2022年09月14日 11:21/ 0 赞/ 74 阅读

相关 mysql 获取分组（group by）中最新的一条数据/最后一条数据

mysql 获取分组group by中最新的一条数据/最后一条数据表结构数据多层嵌套查询表结构数据 select id,s

矫情吗；*/ 2022年09月10日 11:15/ 0 赞/ 325 阅读

相关 mysql中将多条记录合并成一行数据进行显示

mysql中将多条记录合并成一行数据进行显示，说实话，实际开发中很少有这样的，但既然碰见了，在这里几记录一下吧：正常情况下： SELECT REPAY_

￡神魔★判官ぃ/ 2022年05月27日 14:05/ 0 赞/ 760 阅读

相关 Mysql根据时间显示前几条数据。

Mysql语句是:select \ from Product as p order by p.addtime desc limit 6 Hibernate

曾经终败给现在/ 2022年05月27日 13:28/ 0 赞/ 172 阅读

相关 Python的ORM框架sqlalchemy的查询多条数据只显示一条

这个情况可能很少碰到，但确实花了我不少时间去找这个错误，这边记录一下。在使用sqlalchemy作为ORM来拉取mysql的数据的时候，如果想要拉取所有的数据，

￡神魔★判官ぃ/ 2022年05月22日 07:48/ 0 赞/ 627 阅读

相关 js根据数据条数，使表格每一行只显示三条数据，最后一行显示多余的数据。

个人思路，仅供参考！ function show_spots_table(result) { //清空table表格

逃离我推掉我的手/ 2022年04月10日 02:09/ 0 赞/ 149 阅读