Reputation: 45
I am trying to implement copy to clipboard feature using js.
I have a table:
<tbody>
<tr>
<td>1.</td>
<td id="kord">(35|154)</td>
<td id="gorj">15</td>
<td>3,6</td>
<td><button type="button" onclick="copyKord()">Kopiraj</button></td>
<td><button type="button" onclick="copyGorj()">Kopiraj</button></td>
<td><input type="number"></td>
</tr>
</tbody>
My js function:
function copyKord(){
var text = document.getElementById("kord").innerHTML;
console.log(text);
text.select();
document.execCommand("copy");
}
So when i press the button i get an error "TypeError: text.select is not a function at copyKord" when i console.log the variable it shows the text. I tried using textarea insted of a td element and it still didn't work.
Upvotes: 2
Views: 2179
Reputation: 10204
You can use navigator.clipboard.writeText
to perform copy
action.
function copyKord(){
var text = document.getElementById("kord").innerHTML;
navigator.clipboard.writeText(text);
}
function copyGorj() {
var text = document.getElementById("gorj").innerHTML;
navigator.clipboard.writeText(text);
}
<table>
<tbody>
<tr>
<td>1.</td>
<td id="kord">(35|154)</td>
<td id="gorj">15</td>
<td>3,6</td>
<td><button type="button" onclick="copyKord()">Kopiraj</button></td>
<td><button type="button" onclick="copyGorj()">Kopiraj</button></td>
<td><input type="number"></td>
</tr>
</tbody>
</table>
Upvotes: 2