如何选择表格列中的所有文字?

时间:2016-05-17 17:50:44

标签: javascript jquery html css html-table

选择表格列

问题

我试图只选择一列。该表格分为以下类别:unselectselect。我使用css只允许select列单元格显示为选定文本。选择工作很棒,但它只会选择所选列中的单元格。

如果没有选择其他列的文字,我将如何选择整个列的文字?

代码



$('td#select').click(function() {
  if (document.selection) {
    var block = document.body.createTextRange();
    block.moveToElementText($(this)[0]);
    block.select();
  } else {
    var block = document.createRange();
    block.setStartBefore($(this)[0]);
    block.setEndAfter($(this)[0]);
    window.getSelection().addRange(block);
  }
});

td#unselect {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
td#select {
  -webkit-user-select: all;
  -moz-user-select: all;
  -ms-user-select: all;
  -o-user-select: all;
  user-select: all;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<table>
  <tr>
    <td id="unselect">1</td>
    <td id="select">Alex</td>
  </tr>
  <tr>
    <td id="unselect">2</td>
    <td id="select">Bob</td>
  </tr>
  <tr>
    <td id="unselect">3</td>
    <td id="select">Sally</td>
  </tr>
  <tr>
    <td id="unselect">4</td>
    <td id="select">Jim</td>
  </tr>
  <tr>
    <td id="unselect">5</td>
    <td id="select">Jack</td>
  </tr>
  <tr>
    <td id="unselect">6</td>
    <td id="select">Arthur</td>
  </tr>
</table>
&#13;
&#13;
&#13;

JSFiddle

0 个答案:

没有答案