Question

我试图对来自数据库的表项进行分组，该数据库来自各种来源，其中之一是自动警报/警报系统。

表格如下：

＆＃13;

	var rows = [];
	var tableRows = $("#tabla1 > tbody > tr > td:nth-child(3)");
	tableRows.each(function(n){
		var row = {};
		var timecode = this.dataset.timecode;
		var service = this.dataset.service;
		row.timecode = timecode;
		row.service = service;
		rows.push(row)   
	});
	console.log(rows);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tabla1">
	<tbody class="table-hover">
		<tr class="even">
			<td align="center">
				<img src="">
			</td>
			<td><span>ALARM</span>
			</td>
			<td data-timecode="06Oct 18:25 URB07A" data-service="C"></td>
		</tr>
		<tr class="odd">
			<td align="center">
				<img src="">
			</td>
			<td><span>ALARM</span>
			</td>
			<td data-timecode="06Oct 18:27 URB07B" data-service="C"></td>
		</tr>
		<tr class="even">
			<td align="center">
				<img src="">
			</td>
			<td><span>ALARM</span>
			</td>
			<td data-timecode="06Oct 18:27 URB07B" data-service="T"></td>
		</tr>
		<tr class="odd">
			<td align="center">
				<img src="">
			</td>
			<td><span>ALARM</span>
			</td>
			<td data-timecode="06Oct 18:35 CAD51B" data-service="C"></td>
		</tr>
		<tr class="even">
			<td align="center">
				<img src="">
			</td>
			<td><span>ALARM</span>
			</td>
			<td data-timecode="06Oct 18:35 CAD51B" data-service="I"></td>
		</tr>
		<tr class="odd">
			<td align="center">
				<img src="">
			</td>
			<td><span>ALARM</span>
			</td>
			<td data-timecode="06Oct 18:35 CAD51B" data-service="T"></td>
		</tr>
	</tbody>
</table>

＆＃13;

为了给您更多背景知识，表格的每一行都是自动或手动生成的警报/警报。警报的类型显示在＆＃34;数据服务＆＃34;属性以及另一个名为＆＃39; timecode＆＃39;。

的属性上的时间戳和区域代码

这只是一个示例，表中还有其他列对此示例不必要。

我需要做的就是分组或至少突出显示所有时间码＆＃39;是相同的。虽然理想的情况是擦除类似的项目，只留下一个突出显示，这意味着它是各种类型的相同警报。

我已设法在一个对象中组织每个行的时间码＆＃39;和＆＃39;服务＆＃39;。所有这些对象都在一个数组中。

现在，我不知道如何将每个对象与其他对象进行比较，看看是否有相似的时间码＆＃39;。

最后一件事：有时桌子最多可以有1000行，但通常它有150-250个警报。因此，可以考虑做任何例行工作的时间。

Answer 1

您可以使用时间码作为索引：

var rows = {};
var tableRows = $("#tabla1 > tbody > tr > td:nth-child(3)");
tableRows.each(function(n){
    var row = {};
    var timecode = this.dataset.timecode;
    var service = this.dataset.service;
    row.timecode = timecode;
    row.service = service;
    rows[timecode] = rows[timecode] || []
    rows[timecode].push(row)
});
console.log(rows);

Answer 2

我甚至不会为这个对象或其他任何事情烦恼。你说要删除类似的项目并突出其中一个。您需要做的就是找到当前行的时间码。如果其他行具有相同的时间码，请将其删除并突出显示当前时间码。

＆＃13;

$(function() {
  // Note that this is now a list of actual rows, rather than the `td`.
  var tableRows = $("#tabla1 > tbody > tr");
  // Keep track of which timecodes we've removed
  var dupeTimecodes = [];
  tableRows.each(function(n) {
    var row = $(this);
    var timecodeCell = row.find('td').eq(2);
    var timecode = timecodeCell.data('timecode');
    // dupes are cells with the same timecode, that's not this one
    var dupes = tableRows.find('td[data-timecode="' + timecode + '"]').not(timecodeCell);
    // tableRows.each is going to iterate over a cached copy of the DOM, so we need to check if we've already removed it
    if (dupes.length > 0 && dupeTimecodes.indexOf(timecode) === -1) {
      dupeTimecodes.push(timecode);
      // Add a class to the current row
      row.addClass('marked');
      // remove the duplicates
      dupes.each(function() {
        $(this).closest('tr').remove();
      });
    }
  });
});

＆＃13;

.marked { background-color: red; }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tabla1">
  <tbody class="table-hover">
    <tr class="even">
      <td align="center">
        <img src="">
      </td>
      <td><span>ALARM</span>
      </td>
      <td data-timecode="06Oct 18:25 URB07A" data-service="C"></td>
    </tr>
    <tr class="odd">
      <td align="center">
        <img src="">
      </td>
      <td><span>ALARM</span>
      </td>
      <td data-timecode="06Oct 18:27 URB07B" data-service="C"></td>
    </tr>
    <tr class="even">
      <td align="center">
        <img src="">
      </td>
      <td><span>ALARM</span>
      </td>
      <td data-timecode="06Oct 18:27 URB07B" data-service="T"></td>
    </tr>
    <tr class="odd">
      <td align="center">
        <img src="">
      </td>
      <td><span>ALARM</span>
      </td>
      <td data-timecode="06Oct 18:35 CAD51B" data-service="C"></td>
    </tr>
    <tr class="even">
      <td align="center">
        <img src="">
      </td>
      <td><span>ALARM</span>
      </td>
      <td data-timecode="06Oct 18:35 CAD51B" data-service="I"></td>
    </tr>
    <tr class="odd">
      <td align="center">
        <img src="">
      </td>
      <td><span>ALARM</span>
      </td>
      <td data-timecode="06Oct 18:35 CAD51B" data-service="T"></td>
    </tr>
  </tbody>
</table>

＆＃13;

如何根据data-attribute识别表上的重复项

2 个答案: