How can I copy the value(Command column) by clicking the copy button?

Question

https://preview.linuxcommand.dev/

This is my website I'm trying to build, So right now its static and not dynamic, So all are same command you see that. So I want when the copy button on the right side is clicked, It will copy the command text of that column. I don't want to push a different ID of each . Without this, Is there any way to possible?

Possible duplicate of [How do I copy to the clipboard in JavaScript?](https://stackoverflow.com/questions/400212/how-do-i-copy-to-the-clipboard-in-javascript) — Titus, Jul 28 '19 at 15:54
@abid-hasan IDs must be unique in your page. Change them to classes (`class="foo"` instead of `id="foo"`) or use different IDs. — saulotoledo, Jul 28 '19 at 16:07

Murad Sofiyev · Accepted Answer · 2019-07-28T16:02:44.270

1

var buttons = document.querySelectorAll("table button")

function clickButton(){ 
  var myTemporaryInputElement = document.createElement("input");
    myTemporaryInputElement.type = "text";
    myTemporaryInputElement.value = this.parentNode.querySelector("pre code").innerHTML;

    document.body.appendChild(myTemporaryInputElement);

    myTemporaryInputElement.select();
    document.execCommand("Copy");

    document.body.removeChild(myTemporaryInputElement);

}
for (let i = 0; i < buttons.length; i++) {
     buttons[i].addEventListener("click", clickButton);
 }

edited Jul 28 '19 at 16:02

answered Jul 28 '19 at 15:56

Murad Sofiyev

730
5
21

Thanks mate! That works with the ready function. :) – Abid Hasan Jul 28 '19 at 16:43

How can I copy the value(Command column) by clicking the copy button?

1 Answers1