ボタンをクリックしてTEXTをクリップボードにコピーします。テーブル

Question

データを構成するGoogle Webアプリケーションを作成しました。このバケットテキストをクリックすると、コピーを取得することができます。

コピースクリプトは、以降、

が、私は以下のスクリプトを添付した動作していないです。表の最初の行、2行目には正常に動作している、問題

function doGet() { 
 
    return HtmlService 
 
     .createTemplateFromFile('index') 
 
    .evaluate().setTitle("Home Page").setSandboxMode(HtmlService.SandboxMode.IFRAME); 
 
    return html; 
 
} 
 

 
function getData() { 
 
    return SpreadsheetApp 
 
     .openById('1Nf080XKVLtt2AWr469aJrh6vhjdeinxBP1ehV3qBA64') 
 
     .getDataRange() 
 
     .getValues(); 
 
}

 
<div class="w3-container"> 
 
    <h2>Open Requsets</h2> 
 

 
    <input class="w3-input w3-border w3-padding" type="text" placeholder="Search for names.." id="myInput" onkeyup="myFunction()"> 
 
    <? var data = getData(); ?> 
 
    <table class="w3-table-all w3-margin-top " id="myTable"> 
 
    <tr class="w3-pink"> 
 
     <th style="width:10%;">Requset ID</th> 
 
     <th style="width:10%;">Requester Name</th> 
 
     <th style="width:10%;">Requset Type</th> 
 
    </tr> 
 
     <? for (var i = 0; i < data.length; i++) { ?> 
 
     <tr> 
 
      <? for (var j = 0; j < data[i].length; j++) { ?> 
 
      <td><button onclick="copy('demo')"><a href="" target="_blank"><span id="demo"><?= data[i][j] ?></span></a></button> </td> 
 
      <? } ?> 
 
     </tr> 
 
     <? } ?> 
 
    </table> 
 
</div> 
 
    
 

 
    
 
    
 
    <script> 
 
    function copy(element_id){ 
 
    var aux = document.createElement("div"); 
 
    aux.setAttribute("contentEditable", true); 
 
    aux.innerHTML = document.getElementById(element_id).innerHTML; 
 
    aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)"); 
 
    document.body.appendChild(aux); 
 
    aux.focus(); 
 
    document.execCommand("copy"); 
 
    document.body.removeChild(aux); 
 
} 
 
    
 
    </script> 
 
    
 
    <hr> 
 

 

 

 

 
    
 
<!-- for Accordion --> 
 

 
<!-- for Accordion end--> 
 
</body> 
 
</html>

に修正するために私を助けてください

Answer 1

以下の例のように、tdフィールドごとに一意のid値を使用する必要があります。各tdに同じidを使用することはできません。 ​​：

<div class="w3-container"> 
 
    <h2>Open Requsets</h2> 
 

 
    <input class="w3-input w3-border w3-padding" type="text" placeholder="Search for names.." id="myInput" onkeyup="myFunction()"> 
 
    <? var data = getData(); ?> 
 
    <table class="w3-table-all w3-margin-top " id="myTable"> 
 
     <tr class="w3-pink"> 
 
     <th style="width:10%;">Requset ID</th> 
 
     <th style="width:10%;">Requester Name</th> 
 
     <th style="width:10%;">Requset Type</th> 
 
     </tr> 
 
     <? for (var i = 0; i < data.length; i++) { ?> 
 
     <tr> 
 
      <? for (var j = 0; j < data[i].length; j++) { ?> 
 
      <td><button onclick="copy(event)"><a href="" target="_blank"><span><?= data[i][j] ?></span></a></button> </td> 
 
      <? } ?> 
 
     </tr> 
 
     <? } ?> 
 
    </table> 
 
</div> 
 

 

 

 

 
<script> 
 
    function copy($event) { 
 
    var aux = document.createElement("div"); 
 
    aux.setAttribute("contentEditable", true); 
 

 
    //Notice how we retreived the innerHTML 
 
    aux.innerHTML = $event.target.innerHTML; 
 

 
    aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)"); 
 
    document.body.appendChild(aux); 
 
    aux.focus(); 
 
    document.execCommand("copy"); 
 
    document.body.removeChild(aux); 
 
    }