通过jquery在动态生成的html内容中行行不正常

时间:2017-06-14 19:34:39

标签: jquery html

<table>
  <tr>
     <td rowspan="2">test</td>
     <td>test</td>
  </tr>
  <tr>
     <td rowspan="0">test</td>
     <td>test</td>
  </tr>
</table>    

$.each(data.shopTimeArray,function(i)
{
    $tbodyTR = $("<tr>",{}).appendTo($tbody);
    $tbodyTH = $("<th>",{'scope':'row','html':data.shopTimeArray[i].slice(0,-3)}).appendTo($tbodyTR);
    $.each(data.workerids,function(j)
    {
        $.each(data.workerAppointments[data.workerids[j]],function(k)
        {
           if(data.workerAppointments[data.workerids[j]][k].timeArray != "undefined") {
                $.each(data.workerAppointments[data.workerids[j]][k].timeArray,function(y){
                    $rowSpan++;
                });
                } else {
                    $rowSpan = 0;
                }
        });
    });
    $tbodyTD = $("<td>",{'class':classname,'onclick':click,'html':html,'rowspan':$rowSpan,'data-time':time,'workerid':data.workerids[j]}).appendTo($tbodyTR);
});

{"shopTimeArray":["10:00:00","10:15:00","10:30:00","10:45:00","11:00:00","11:15:00","11:30:00","11:45:00","12:00:00"],"workernames":["Kapper 1","Kapper 2"],"workerTimes":{"148":["10:00:00","10:15:00","10:30:00","10:45:00","11:00:00","11:15:00","11:30:00","11:45:00","12:00:00"],"196":["10:00:00","10:15:00","10:30:00","10:45:00","11:00:00","11:15:00","11:30:00","11:45:00","12:00:00"]},"workerAppointments":{"148":[{"timeArray":["10:00:00","10:15:00","10:30:00","10:45:00"]}],"196":[{"timeArray":["09:30:00","09:45:00"]},"workerids":["148","196"],"today":"2017-06-19","dayname":"1"}

我在这里创建动态html,

如果有rowspan = 5

,我想跳过下一个5 td

想跳过的值是在workerAppointments [workerid] [timearray]

寻求帮助

https://imgur.com/a/xCais&#34;工具提示&#34;

看看我添加的表是由jquery生成的,你可以在表中看到如果rowspan = 2而不是下一个tr第一个td将不会添加,但是通过我上面的jquery代码,它添加了如上表所示的创建。

1 个答案:

答案 0 :(得分:1)

您可以拥有一个名为skipColumnCount的变量,并在您的内循环中执行类似

的操作
if (skipColumnCount > 0) {
    skipColumnCount--;
    continue;
}

因此,要跳过5列,您必须将其设置为5。