How to copy TEXT to Clipboard on Button-Click

In Twine’s Javascript editor:

window.CopyToClipboard = function (element){
  var $temp = $("<input>");
  $("body").append($temp);
  $temp.val($(element).text()).select();
  document.execCommand("copy");
  $temp.remove();
}

window.CopyToClipboard = function (element){
  var $temp = $("<input>");
  $("body").append($temp);
  $temp.val($(element).text()).select();
  document.execCommand("copy");
  $temp.remove();
}

Optional (as last line under “temp.remove”):     alert("Text has been copied, now paste in the text-area") In the passage:

<button id="button1" onclick="CopyToClipboard('#div1')">Click to copy</button>
<span id="div1”>TEXT TO BE COPIED</span>

<button id="button1" onclick="CopyToClipboard('#div1')">Click to copy</button>
<span id="div1”>TEXT TO BE COPIED</span>

Optional (useful for testing):

<textarea placeholder="Press ctrl+v to Paste the copied text" rows="5" cols="20"></textarea>

HTML HTML

15

1

2

3

4

5 ▾

How to copy a TEXT to Clipboard on a Button-Click

6

7 ▾

CSS CSS

xxxxxxxxxx 28

1 ▾ body { 2              background-color:#999999; 3              font-family: ‘Oswald’, sans-serif; 4     } 5 p 6 ▾ { 7  color:#000000; 8  font-size:20px; 9 } 10

11 .textBox 12 ▾ { 13  height:30px; 14  width:300px; 15 } 16

17 button 18 ▾ { 19  height:30px; 20  width:150px; 21  border-radius:8px; 22  padding:10px; 23  font-size:20px; 24  font-family: ‘Oswald’, sans-serif;

JS

JS 0 unsaved changes

x

1 ▾ function copyToClipboard(element) { 2  var $temp = ("<input>"); 3  $("<input>"); 3$(“body”).append(temp); 4  $temp); 4$temp.val((element).text()).select(); 5  document.execCommand("copy"); 6  $(element).text()).select(); 5  document.execCommand("copy"); 6$temp.remove(); 7 } 8