如何为表创建“全选”按钮

I am creating an table for an website. The website returns its values in an table. i need to copy all values from the table td's, and paste them in excel. is there a way to make a "select all" button, so that i only need to press ctrl+c? Instead of dragging my mouse all the way down the table.

I want outcome to be like this (if I press the button)

Code of the table i used here:

<!DOCTYPE html>
<html>
<head>
    <style>
        table,
        th,
        td {
            border: 1px solid black;
            border-collapse: collapse;
        }
    </style>
</head>
<body>
    <h2>Select all test</h2>
    <button type="button">Select all</button>
    <table style="width:80%">
        <tr>
          <th>Name</th>
          <th>Lastname</th>
          <th>Age</th>
        </tr>
        <tr>
            <td>Henk</td>
            <td>Bakker</td>
            <td>46</td>
        </tr>
        <tr>
            <td>Fedde</td>
            <td>hooghouts</td>
            <td>67</td>
        </tr>
    </table>
</body>
</html>

</div>
douyi1939
douyi1939 如果它是一个基本的HTML表,您可以使用菜单-数据-从Web导入,然后复制粘贴URL并选择正确的表,直接将其导入Excel。如果您所做的只是为手动操作制作快捷方式,那么教我的用户比实际创建要选择的脚本更容易,然后按ctrl-c,转到Excel,粘贴数据,重新格式化数据。
11 个月之前 回复
dongqiaogouk86049
dongqiaogouk86049 你尝试使用javascript或jquery链接
11 个月之前 回复
dtcmadj31951
dtcmadj31951 对的,这是可能的。
11 个月之前 回复

1个回答

JS:

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);
            }
        } else if (body.createTextRange) {
            range = body.createTextRange();
            range.moveToElementText(el);
            range.select();
        }
    }

HTML:

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

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

It should work ;)

Link from: Select a complete table with Javascript

dongshiliao7990
dongshiliao7990 是的,尝试从代码中删除<thead>部分
11 个月之前 回复
dongqian7545
dongqian7545 它是否也可以只选择和复制tbody,但是龙骨布局? 所以它还复制边框和东西? 因为现在如果我将它粘贴在excel中,它会进入1个单元格
11 个月之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问