如何在Microsoft Edge上选择和复制表格元素? (CTRL + C)

时间:2019-08-01 07:26:39

标签: javascript html dom copy microsoft-edge

setMyState(prevState => {
  return [...prevState, 1];
});

我知道复制可在某些事件单击中使用,我已经更新了最新代码,我在单击复制按钮时调用了复制功能。 该代码不会引发任何错误,但在Edge上也不会执行任何操作。请提出一些修改建议。

1 个答案:

答案 0 :(得分:0)

我尝试测试您的代码,发现您上面的代码示例甚至无法在任何其他浏览器上运行。这可能是一个逻辑问题。我建议您尝试一边运行上面的示例来检查结果。

尝试逐步调试代码可以为您提供有关该问题的信息。

另一种方法是使用.clone()方法。

您可以尝试参考以下示例。它已经在chrome和MS Edge浏览器上进行了测试,并且可以正常运行。

<!DOCTYPE html>
<html>
<head>
	<title>Page Title</title>
	
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){

$('#copy1').click(function() {

$('tr.selected', '#exampleTable1').each(function() {

    // For each "selected" row of table1 ..
    var rowFromTable1 = $(this);

    // .. Take a clone/copy of it ..
    var clonedRowFromTable1 = rowFromTable1.clone();

    // .. And append the cloned row to the tbody of table2
    $('tbody', '#exampleTable2').append( clonedRowFromTable1 )
 })

 })

});
</script>
	
	
</head>
<body>
<table id="exampleTable1" style="max-width:50%;">
    <thead>
        <tr>
            <th>bar-code</th>
            <th>product name</th>
        </tr>
    </thead>
    <tbody>
        <tr role="row" class="odd selected">
            <td class="sorting_1">545333456</td>
            <td>Galaxy S9</td>
        </tr>
        <tr role="row" class="even selected">
            <td class="sorting_1">876543</td>
            <td>Galaxy S6</td>
        </tr>
        <tr role="row" class="odd">
            <td class="sorting_1">407654</td>
            <td>SD 64G </td>
        </tr>
        <tr role="row" class="even selected">
            <td class="sorting_1">876543</td>
            <td>Galaxy S5</td>
        <tr role="row" class="odd">
            <td class="sorting_1">407654</td>
            <td>Iphone 7 </td>
        </tr>
    </tbody>
</table>

<table id="exampleTable2" style="max-width:50%;">
    <thead>
        <tr>
            <th>bar-code</th>
            <th>product name</th>
        </tr>
    </thead>
    <tbody>
        <tr>
        </tr>
        <tr>
        </tr>
    </tbody>
</table>

<button class="btn btn-success" data-panelId="copy1" id="copy1">
    Copy from exampleTable1 To exampleTable1
</button>


</body>
</html>

在MS Edge浏览器中输出:

enter image description here

此外,您可以根据自己的要求修改示例。

参考:

Copy data from selected rows of one table to another table using jQuery