Как скопировать переменные в тексте с помощью кнопки копирования?

Question

Я довольно новичок в кодировании, поэтому извините, если мое описание немного расплывчато.

Я создал кнопку "Копировать" в JavaScript:

function CopyToClipboard(containerid) {
  if (document.selection) {
    var range = document.body.createTextRange();
    range.moveToElementText(document.getElementById(containerid));
    range.select().createTextRange();
    document.execCommand("copy");
  } else if (window.getSelection) {
    var range = document.createRange();
    range.selectNode(document.getElementById(containerid));
    window.getSelection().addRange(range);
    document.execCommand("copy");
    alert("text copied, copy in the text-area")
  }
}

<span id="myInput">
  <p>
    Rope color: <strong><span id="colorName"></span></strong><br>
    Type of clamp <strong><span id="clampName"></span></strong><br>
    Rope length: 130cm <strong><span id="ropeLength"></span></strong>
  </p>
</span>
<button id="button1" onclick="CopyToClipboard('myInput')">Copy</button>

Теперь кнопка работает нормально, но эта функция копирует только текст из div, а не из переменных.
Переменные:

• colorName (например, красный, синий и др. c)

• clampName (например, сильный, эксперт и c). )

• ropeLength (всегда начинается с "+", а затем "XXXcm")

Как я могу убедиться во всем (текст и Переменные) копируется?

РЕДАКТИРОВАТЬ: Кажется, проблема в другом ... Когда единственный щелчок непосредственно на кнопку, копия работает. При нажатии в любом месте, кроме кнопки, а затем на кнопку. Кнопка больше не работает / не копирует. Я думаю, что это проблема, поскольку переменные заполняются нажатием на форму (например, выбирая красный в качестве цвета). Любая помощь с этим?

Answer 1

Это приведенное ниже решение в зависимости от вашего решения работает нормально. Единственное изменение, которое я сделал, - переместил событие click в прослушиватель событий.

document.getElementById("button1").addEventListener("click", CopyToClipboard);
function CopyToClipboard() {
    var containerid = "myInput";
    ...
}

https://jsfiddle.net/q6kz4weu/