如何将带有输入文本的表格数据作为没有 jQuery 的单元格复制到剪贴板？

Question

我有一个类似于以下格式的简单表格：

<table>
  <thead>
    <tr>
      <th>Savings</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Savings 
         <button type="button" (click)="submit()">Click Here</button>
      </td>
      <td *ngFor="let data in items"><input type="text" [value]="data.savings"></td>
    </tr>
    <tr>
     <td> [Similar to above row]</td>
    </tr> 
  </tbody>
</table>

如何在没有 jQuery 维护行结构的情况下正确复制具有输入值的表？ 我只关心行数据，而不关心标题或单元格名称。 我咨询了将表格行复制到剪贴板 - 仅复制第一页，但它复制数据结构而不是输入字段值？

Answer 1

你是说获取表格每一行输入框的值？ 可以用纯javascript获取：

<script>
     var  values=document.getElementsByTagName("input");
     alert(values[0].value);
</script>

//document.getElementsByTagName(name) ：按标签名查找元素

这可以复制：

<script type="text/javascript">
function copy()
{
 var  values=document.getElementsByTagName("input");
 values[0].select(); // Select object
 document.execCommand("Copy"); //Execute browser copy command
 alert("Has been copied, can be pasted");
}
</script>
<input type="button" onClick="copy()" value="Click Copy Code" />

复制多行：

<script type="text/javascript">
function copy()
{

    var  values=document.getElementsByTagName("input");
    var textarea =document.createElement('textarea'); // create  textarea label
    //Traverse the content of the table and splice it into the content of the textarea
    for(var i=0;i<values.length; i++){
         textarea.innerHTML= textarea.innerHTML+=values[i].value+'\n'
    }
    document.body.appendChild(textarea) // Add to body  
    textarea.select();    
    document.execCommand("Copy"); //Execute browser copy command
    textarea.remove(); 
    alert("Has been copied, can be pasted");
}
</script>
<input type="button" onClick="copy()" value="Click Copy Code" />