Javascript 的复制到剪贴板问题

Question

我试图弄清楚为什么当我从 Javascript 加载表格时复制到剪贴板不起作用。 如果我不从 js 文件加载表并将表放在 HTML 页面中，它可以工作。 有人可以解释为什么它不起作用以及如何解决吗？ 谢谢！

HTML 页

<!DOCTYPE html>
<!-- saved from url=(0014)about:internet -->
<html lang="en">
<html>
<head>
<title>Central</title>

<meta name="viewport" content="width=device-width">
</head>
<body>
<div id="container">
    
<div id="Table">

</div>
        
</div>

</body>

<script type="text/javascript" src="Copy.js"></script>

<script>
var a = document.getElementsByClassName('CopyButton');

for (var i = 0; i < a.length; i++) {
  a[i].addEventListener('click', function() {
    var b = this.parentNode.parentNode.cells[2].textContent;
    //alert(b);
    copyToClipboard(b);
    
  });
}

function copyToClipboard(text) {
  var dummy = document.createElement("textarea");
  document.body.appendChild(dummy);
  dummy.value = text;
  dummy.select();
  document.execCommand("copy");
  document.body.removeChild(dummy);
}

window.onload = function() {
    
GetCopy();
   }
</script>
</html>

.js

function GetCopy() {
var data = '<table id="myTable"> \
<tr class="header"> \
<th>Title</th> \
<th></th> \
<th>Verbiage</th> \
</tr> \
<tr><td>Row 1</td> \
<td><input type="button" class="CopyButton" value="Copy" onclick="" /></td> \
<td>Copy Me 1</td> \
</tr> \
<tr><td>Row 2</td> \
<td><input type="button" class="CopyButton" value="Copy" onclick="" /></td> \
<td>Copy Me 2</td> \
</tr> \
</table>'
document.getElementById('Table').innerHTML =data; }

Answer 1

添加新的 HTML 后，您需要附加事件侦听器； 您当前正在寻找元素，然后再添加它们。

window.onload = function() {
    GetCopy();
    var a = document.getElementsByClassName('CopyButton');
    
    for (var i = 0; i < a.length; i++) {
      a[i].addEventListener('click', function() {
        var b = this.parentNode.parentNode.cells[2].textContent;
        //alert(b);
        copyToClipboard(b);
        
      });
    }
}

Javascript 的复制到剪贴板问题

问题描述

1 个解决方案

解决方案1
0 已采纳 2020-08-06 21:18:35

Javascript 的复制到剪贴板问题

问题描述

1 个解决方案

解决方案1 0 已采纳 2020-08-06 21:18:35

解决方案1
0 已采纳 2020-08-06 21:18:35