Question

如何将属于User 2的所有单元格重组为一行，就像User 1和User 3一样？

因此，脚本不应为同一个用户id设置多行，而应将它们分组到一行，User 2相应地显示所有指示的橙色单元格。

该表是从PHP代码动态创建的但是，如果可以使用一个非常好的SQL语句来完成它，那么jQuery或JS代码可以在它加载后重新组合它也有帮助，任何想法？

    <table class="table table-bordered" id="whois-onleave" style="font-size:10px;">
      <thead>
        <tr style="text-align: center;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;font-size: large"><td>July 2017</td></tr>
        <tr>
          <td>&nbsp;</td>
          <td class=" currentday-bg dayoff"><b>Sat</b></td><td class=" dayoff"><b>Sun</b></td><td><b>Mon</b></td><td><b>Tue</b></td><td><b>Wed</b></td><td><b>Thu</b></td><td><b>Fri</b></td><td class=" dayoff"><b>Sat</b></td><td class=" dayoff"><b>Sun</b></td><td><b>Mon</b></td><td><b>Tue</b></td><td><b>Wed</b></td><td><b>Thu</b></td><td><b>Fri</b></td><td class=" dayoff"><b>Sat</b></td><td class=" dayoff"><b>Sun</b></td><td><b>Mon</b></td><td><b>Tue</b></td><td><b>Wed</b></td><td><b>Thu</b></td><td><b>Fri</b></td><td class=" dayoff"><b>Sat</b></td><td class=" dayoff"><b>Sun</b></td><td><b>Mon</b></td><td><b>Tue</b></td><td><b>Wed</b></td><td><b>Thu</b></td><td><b>Fri</b></td><td class=" dayoff"><b>Sat</b></td><td class=" dayoff"><b>Sun</b></td><td><b>Mon</b></td>    </tr>
</thead>
<tbody>
        <tr>
          <td width="12"><b>Employee</b></td>
          <td class=" currentday-bg dayoff"><b>1</b></td><td class=" dayoff"><b>2</b></td><td><b>3</b></td><td><b>4</b></td><td><b>5</b></td><td><b>6</b></td><td><b>7</b></td><td class=" dayoff"><b>8</b></td><td class=" dayoff"><b>9</b></td><td><b>10</b></td><td><b>11</b></td><td><b>12</b></td><td><b>13</b></td><td><b>14</b></td><td class=" dayoff"><b>15</b></td><td class=" dayoff"><b>16</b></td><td><b>17</b></td><td><b>18</b></td><td><b>19</b></td><td><b>20</b></td><td><b>21</b></td><td class=" dayoff"><b>22</b></td><td class=" dayoff"><b>23</b></td><td><b>24</b></td><td><b>25</b></td><td><b>26</b></td><td><b>27</b></td><td><b>28</b></td><td class=" dayoff"><b>29</b></td><td class=" dayoff"><b>30</b></td><td><b>31</b></td>    </tr>
        <tr>
          <td>User 1</td>
          <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
        <td>User 2</td>
        <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td class=" allrequested"></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
        <td>User 2</td>
        <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td class=" allrequested"></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
        <td>User 2</td>
        <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td class=" allrequested"></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
        <td>User 2</td>
        <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td class=" allrequested"></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
        <td>User 2</td>
        <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td class=" allrequested"></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
        <td>User 2</td>
        <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td class=" allrequested"></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
        <td>User 3</td>
        <td class=" currentday-bg dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" dayoff allaccepted"></td><td class=" dayoff allaccepted"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td class=" allaccepted"></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td><td></td><td></td><td></td><td></td><td class=" dayoff"></td><td class=" dayoff"></td><td></td>    </tr><tr>
      </tbody>
    </table>

Answer 1

如下面的评论中所说，你的问题...... 我认为您应该使用SQL查询来合并服务器端的员工信息。

它对3个“用户”的表没有影响。

但依靠客户端执行此类任务并不是很好的设计...... 表演谈话。

让我们想想500多名员工，每对员工都会“离开”。

这会让你的公司成为夏令营的一部分！ 哈哈！的

但是你必须在编码时考虑性能......
编码就像一个企业。

好的，请哲学...... 以下是在一行中“合并”所有员工信息的jQuery代码：
（从提供的示例表中，假设“用户”按顺序出现）

$(document).ready(function(){

  var tableRows = $(".table tr");
  console.log(tableRows.length);

  var previousEmployee = tableRows.find("td").last();
  //console.log(previousEmployee.html());

  // Run throught the rows
  tableRows.each(function(){

    var employee = $(this).find("td").first();
    //console.log(employee.html());

    // If we have a second row for the same employee.
    if( employee.html() == previousEmployee.html() ){
      console.log(employee.html());

      // Move the classes to the above row.
      var thisrowTDcollection = employee.parent("tr").find("td");
      for(j=0;j<thisrowTDcollection.length;j++){
        var classtoMove = thisrowTDcollection.eq(j).attr("class");
        employee.parent("tr").prev().find("td").eq(j).addClass(classtoMove);
      }

      // Now remove this row.
      $(this).remove();

    }
    previousEmployee = employee;
  });
});

CodePen

SQL / JS如何将重复行重新排列为一个

1 个答案: