如何知道HTMLTableDataCellElement的整个文本被选中

Question

我有一个包含可编辑列的表，当选择了可编辑列中的文本时，我们如何使用java-script检查HTMLTableDataCellElement的整个文本是否被选中？

与输入字段类似，有一种方法

input.selectionStart == 0 && input.selectionEnd == input.value.length。

感谢。

Answer 1

我试一试。

document.onmouseup = (e) => {
  e = e || window.event;
  const target = e.target || e.srcElement;
  const selection = window.getSelection().toString();
  if (target.innerHTML === selection) {
    alert('Cell fully selected!');
  }
};

table {
  border-collapse: collapse;
}

td {
  padding: 4px 8px;
}

<table id="myTable" border="1">
  <tr>
    <td>Lorem ipsum</td>
    <td>Dolor sit</td>
  </tr>
  <tr>
    <td>Lorem ipsum</td>
    <td>Dolor sit amet dolor sit amet</td>
  </tr>
  <tr>
    <td>Lorem</td>
    <td>Ipsum dolor</td>
  </tr>
</table>