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