How Can I Select A Variable To Copy?

Question

var delayBecauseFirebase = 1000;
setTimeout(function() {
      var buttonShowJ = document.getElementById("buttonShow");
      var messagesInJ = document.getElementById("messagesIn");
      if(buttonShowJ)
      {
        buttonShowJ.addEventListener("click",function(){
          var info = messagesInJ.innerHTML.replace(`<button id="buttonShow">Copy</button>`,"");
          info.select(); \\**(!HERE, because that doesnt works)**
          document.execCommand("copy");
        });
      }else{
        console.log("error");
      }
}, delayBecauseFirebase);

I want to select the "text" inside info to can do

document.execCommand("copy");

But i dont know how can i use select for that var.

Did you try innerText? https://developer.mozilla.org/es/docs/Web/API/HTMLElement/innerText — Germán Faller, Jan 06 '21 at 17:48
Does this answer your question? [How do I copy to the clipboard in JavaScript?](https://stackoverflow.com/questions/400212/how-do-i-copy-to-the-clipboard-in-javascript) — imvain2, Jan 06 '21 at 17:50
@GermanFaller yes, but with innerText "Copy" doesn't disappear. But thx. — Mitsworth SCZD, Jan 06 '21 at 17:52
Your problem is that variable info is a string, not an element. Select is not a method of a string. Instead, you probably should consider using Clipboard.writeText(info), or put info in an html element that you select. — Russ, Jan 06 '21 at 17:53
so, why not having 3 elements ```
``` easier to get just the text — Germán Faller, Jan 06 '21 at 17:54

Germán Faller · Accepted Answer · 2021-01-06T18:26:34.293

0

I think this could work

In the HTML

<div class="container">
  <div id="messagesIn">
    ...Some Text
  </div>
  <button id="buttonShow">Copy</button>
</div>

Then in the code

var delayBecauseFirebase = 1000;

function copyText(){
    //Select your text
    var range = document.createRange();
    range.selectNode(document.getElementById("messagesIn"));
    window.getSelection().removeAllRanges();
    window.getSelection().addRange(range);

    //Call copy command
    document.execCommand("copy");
}

function addClickListener() {
    var buttonShowJ = document.getElementById("buttonShow");
    if(buttonShowJ){
        buttonShowJ.addEventListener("click", copyText);
    }else{
        console.error("Copy button not found");
    }
}

setTimeout(addClickListener, delayBecauseFirebase);

Recomended post:

edited Jan 06 '21 at 18:26

answered Jan 06 '21 at 18:05

Germán Faller

546
7
15

Thx for help, btw "document.execCommand("copy")" doesnt work if "info" arent select. (Based on what i read). So that is why i asked this. And with Clipboard.writeText(info) the same error like select() that isnt a function. – Mitsworth SCZD Jan 06 '21 at 18:19
I was looking for that, now, check the edited answer – Germán Faller Jan 06 '21 at 18:21
1

I checked and I understand what u said. Ur Code is more Clean and work ^^. – Mitsworth SCZD Jan 06 '21 at 18:24
@MitsworthSCZD so, please if this works and you consider as a correct answer, Accept this answer. :D – Germán Faller Jan 06 '21 at 18:33

How Can I Select A Variable To Copy?

1 Answers1