使用Javascript选择完整的表（复制到剪贴板）

我想知道是否有人知道如何使用js选择完整的表，这样用户就可以右键单击所选内容，将其复制到剪贴板，然后将其粘贴到Excel上。如果手动选择该表，则该过程将非常有效。但有时，如果桌子的高度比屏幕大几倍，则通过拖动鼠标来选择它会变得单调乏味。因此，我想让用户可以点击“选择整个表格”按钮，所有内容都可以被复制

---

有什么想法吗？

有。这并不太棘手，以下内容适用于所有主流浏览器（包括IE 6和IE 5）：

（在Jukka Korpela指出前一版本无法在IE 9标准模式下工作后，于2012年9月7日更新）

演示：

代码：

功能选择元素内容（el）{
var body=document.body，范围，sel；
if（document.createRange&&window.getSelection）{
range=document.createRange（）；
sel=window.getSelection（）；
选择removeAllRanges（）；
试一试{
范围。选择节点内容（el）；
选择添加范围（范围）；
}捕获（e）{
范围。选择节点（el）；
选择添加范围（范围）；
}
}else if（body.createTextRange）{
range=body.createTextRange（）；
范围。移动到元素文本（el）；
range.select（）；
}
}

标题1标题2
第1单元第2单元

通过使用以下脚本，我终于在IE9中实现了

注意：它不适用于html表。它必须是一个DIV。所以只需在需要选择的表周围放置一个包装DIV

首先，我稍微更改了HTML按钮代码：

<input type="button" value="Mark table"    onclick="SelectContent('table1');">  

---

为了使Tim Down建议的代码更加完整，允许将取消选择的内容自动复制到剪贴板：

<script type="text/javascript">
    function selectElementContents(el) {
        var body = document.body, range, sel;
        if (document.createRange && window.getSelection) {
            range = document.createRange();
            sel = window.getSelection();
            sel.removeAllRanges();
            try {
                range.selectNodeContents(el);
                sel.addRange(range);
            } catch (e) {
                range.selectNode(el);
                sel.addRange(range);
            }
            document.execCommand("copy");

        } else if (body.createTextRange) {
            range = body.createTextRange();
            range.moveToElementText(el);
            range.select();
            range.execCommand("Copy");
        }
    }
</script>

<table id="tableId">
    <thead>
        <tr><th>Heading</th><th>Heading</th></tr>
    </thead>
    <tbody>
        <tr><td>cell</td><td>cell</td></tr>
    </tbody>
</table>

<input type="button" value="select table"
   onclick="selectElementContents( document.getElementById('tableId') );">

功能选择元素内容（el）{
var body=document.body，范围，sel；
if（document.createRange&&window.getSelection）{
range=document.createRange（）；
sel=window.getSelection（）；
选择removeAllRanges（）；
试一试{
范围。选择节点内容（el）；
选择添加范围（范围）；
}捕获（e）{
范围。选择节点（el）；
选择添加范围（范围）；
}
文件。执行命令（“副本”）；
}else if（body.createTextRange）{
range=body.createTextRange（）；
范围。移动到元素文本（el）；
range.select（）；
range.execCommand（“复制”）；
}
}
标题
细胞

这是我用过的。它还生成了“复制”命令，因此您只需在要将其放入的文档中使用“粘贴”命令。基本上，您将要复制的内容包装在一个div中，使用innerHTML获取它并将其复制到剪贴板。我并没有在所有浏览器上测试过它，但它可以在Chrome、Safari和Firefox上运行

<div id="copycontent">
<table>
</table>
</div>
<input type="button" value="Mark table"    onclick="SelectContent('copycontent');">

<script type="text/javascript">
function SelectContent (el) {    
  var aux = document.createElement("div");
  aux.setAttribute("contentEditable", true);
  aux.innerHTML = document.getElementById("main").innerHTML;
  aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)"); 
  document.body.appendChild(aux);
  aux.focus();
  document.execCommand("copy");
  document.body.removeChild(aux);
}
</script>

函数SelectContent（el）{
var aux=document.createElement（“div”）；
辅助设置属性（“内容可编辑”，真）；
aux.innerHTML=document.getElementById（“main”）.innerHTML；
aux.setAttribute（“onfocus”、“document.execCommand（'selectAll'，false，null）”）；
文件.正文.附件（aux）；
辅助焦点（）；
文件。执行命令（“副本”）；
文件.body.removeChild（aux）；
}

在IE 9上，这在“标准模式”下不起作用。控制台显示一条关于未能完成操作的错误消息，错误代码为800a025e，与行

range.select（）相关。在怪癖模式下，当浏览器模式设置为IE 8时，它会工作。@JukkaK.Korpela很有趣，谢谢。我已经用一个变通方法更新了我的答案。很好的解决方案。再加上一个提示，如果像我一样，你想让这一切发生而不引起重画：1。让selectElementComments返回false（即添加
return false；
作为selectElementComments的最后一行。2.使用
onclick=“return selectElementContents（…）
谢谢并复制剪贴板请确保它选择了表格，但如何将其自动复制到剪贴板？这并不理想，因为用户仍然需要按ctrl-c或复制粘贴。当我指向一个封装时，我终于实现了这一点，所以onclick=“SelectContent（'dv'）；”……数据
<div id="copycontent">
<table>
</table>
</div>
<input type="button" value="Mark table"    onclick="SelectContent('copycontent');">

<script type="text/javascript">
function SelectContent (el) {    
  var aux = document.createElement("div");
  aux.setAttribute("contentEditable", true);
  aux.innerHTML = document.getElementById("main").innerHTML;
  aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)"); 
  document.body.appendChild(aux);
  aux.focus();
  document.execCommand("copy");
  document.body.removeChild(aux);
}
</script>