Question

我找到了一个很好的脚本来突出显示html表行，它运行正常：

http://nerds-central.blogspot.ca/2006/12/selectable-table-rows-with-html-and.html

我更改了onmouseover的onclick事件，并添加了几行来选择单元格onclick。所以，我能够选择它，检查选择哪一个并获取值，但我想在按 CTRL + C 时复制单元格值而不必选择内容（如在Microsoft Excel中）。

只有 CTRL + C 应该没问题，但是如果你也有一个线索来通过右键单击下拉菜单来完成这个技巧，那就太棒了！

Answer 1

这是一个片段，可以在复制之前自动选择一个单元格，但它仅适用于 CTRL + C 。

window.onload = function () {
    var selected,
        selectCell = function (e) {
            var cell = e.target,
                range, selection;
            if (cell.tagName.toLowerCase() !== 'td') {
                while (cell = cell.parentElement) {
                    if (cell.tagName.toLowerCase() === 'td') {
                        break;
                    }               
                }
            }
            if (!cell || cell.tagName.toLowerCase() !== 'td') {
                return;
            }
            if (selected) {
                selected.style.backgroundColor = '';            
            }
            cell.style.backgroundColor = '#ff0';
            selected = cell;
        },
        beforeCopyCell = function (e) {
            var range, selection;
            if (!selected || !e.ctrlKey || e.which !== 67) {
                return;
            }
            selected.focus();
            selection = window.getSelection();
            selection.removeAllRanges();
            range = document.createRange();
            range.selectNode(selected);             
            selection.addRange(range);
        },
        afterCopyCell = function (e) {
            if (!selected || !e.ctrlKey || e.which !== 67) {
                return;
            }
            selection = window.getSelection();
            selection.removeAllRanges();
        },
        table = document.getElementById('table');
    table.addEventListener('click', selectCell);
    table.addEventListener('keydown', beforeCopyCell);
    document.body.addEventListener('keyup', afterCopyCell);
};

代码似乎在FF25，Chrome31和IE11中运行良好，但它在IE＆lt; 9中无效。

A live demo at jsFiddle。（这个小提琴演示了一个替代代码，它与IE不兼容。）

Another demo，它以某种方式实现了通过contextmenu复制单元格。这仅适用于FF26，Chrome31和IE11，但如果省略/重建所选单元格的类切换，则代码应该是IE9 +可混合。

突出显示html表格单元格，并使用CTRL + C复制值

1 个答案: