勾选一个单元格中的复选框，具体取决于同一行级别的另一个单元格中的内容

Posted 2023-02-21

【中文标题】勾选一个单元格中的复选框，具体取决于同一行级别的另一个单元格中的内容

【英文标题】：Tick checkboxes in one cell depending on content in another at the same row level

【发布时间】：2020-07-31 17:13:23

【问题描述】：

我需要预先选择复选框，以便更改它们的状态。不幸的是，我不是 javascript 人。

循环必须看起来像这样

tick:
td.col-clipboard input.smallCheckboxes
if:
td.col-clipboard (last-child) contains "sometextstring"

请帮忙，否则我必须手动勾选大约 2000 条记录。

可以使用纯 JS 或 Prototype JavaScript 框架（版本 1.7.1）。这是一个较旧的 TYPO3 后端。

非常感谢您！

【参考方案1】：

Prototype.js 让这变得非常简单：

$$('td.col-clipboard input.smallCheckboxes').select(function(elm)
  return elm.up('tr').down('td:last-of-type').innerhtml.include('sometextstring')
).invoke(writeAttribute, 'checked', 'checked');

您可以先选择 TR 来简化它：

$$('tr').map(function(elm)
  if elm.innerHTML.include('sometextstring')
    elm.down('input.smallCheckboxes').writeAttribute('checked', 'checked');
  
);

如果您的 TR 具有类名或表具有 ID，则可以通过更改最外层的 $$（按 CSS 选择器查找全部）方法的参数来匹配初始选择范围。

【参考方案2】：

我创建了一个示例，检查表格的每一行并将该行中的所有复选框设置为true，如果该行中的最后一个单元格包含预定义的变量：

const rows = Array.from(document.getElementsByTagName('tr'));
const str = 'sometextstring';

rows.forEach(row => 
  const cells = Array.from(row.cells);
  // Find last cell in this row
  const target = cells[cells.length - 1].innerHTML;
  // Compare str to the contents of the cell
  if (target === str) 
    // Set all checkboxes in this row to true except the last one
    for (let i = 0; i < cells.length - 1; i++) 
        cells[i].querySelector('input').checked = true;
    
  
)

我的示例区分大小写。

请在此处找到 jsfiddle：https://jsfiddle.net/sanderdebr/z23mfthc/34/