Question

正如我的previous post所说，我想在网页中实现复制和粘贴功能。我想使用document.execcommand（“ copy”）来实现该功能，以便用户可以使用Ctrl-Z来回滚复制操作。但是，谷歌浏览器似乎不支持多个范围的选择，因此，我需要找到解决该问题的另一种方法。

我从Google搜索了一些示例代码后，可以将1个表格单元格数据复制到另一个。但是，如果没有。要复制的表单元格的值大于1，它只是将最后一个数据源值保留在最后一个目标单元格中。其他所有数据值均不保留。这是我的代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Copy event to clipboard</title>
        <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
        <script>
            $( document ).ready(function() {
                $("td").on("paste",function(event){
                    console.log("cell paste event");
                    var self = this;
                    setTimeout(function() {
                        self.blur();
                    }, 0);
                });
                $("body").keydown(function(event){
                    switch (event.which)
                    {
                        case 86://v
                                if (event.ctrlKey)  
                                {
                                    pasteDemo(event);
                                }
                    }           
                });
            });
            function pasteDemo(event)
            {
                console.log("Body Paste Event");
                var inputBox=document.createElement("input");
                var cell,cellNames=["c11","c12","c13"];
                var data=["QQ","SS","RR"];

                $("body").append(inputBox);

                for (var i=0;i<cellNames.length;i++)
                {
                    cell=document.getElementById(cellNames[i]);
                    inputBox.value=data[i];
                    inputBox.select();
                    console.log("Copy Result="+document.execCommand("copy"));
                    cell.focus();
                    console.log("Paste Result="+document.execCommand("paste"));
                }
                $(inputBox).remove();
            }
        </script>   
    </head>
    <body>
        <table border="1" id="destTable" width="500px">
            <tr>
                <td id="c11" contenteditable="true"></td>
                <td id="c12" contenteditable="true"></td>
                <td id="c13" contenteditable="true"></td>
            </tr>
            <tr>
                <td id="c21" contenteditable="true"></td>
                <td id="c22" contenteditable="true"></td>
                <td id="c23" contenteditable="true"></td>
            </tr>
            <tr>
                <td id="c31" contenteditable="true"></td>
                <td id="c32" contenteditable="true"></td>
                <td id="c33" contenteditable="true"></td>
            </tr>
        </table>
    </body>
</html>

加载上一页后，然后在键盘上按Ctrl-V，只有“ RR”值保留在第三个单元格中，其他值消失了，如何将其他值保留在相应的单元格中？ / p>

如何复制多个表单元格数据，然后将其正确粘贴到目标位置？

0 个答案: