Javascript 用于多个按钮的复制到剪贴板功能如何从id切换到类标识符

我需要一些帮助，请我有一个很好的复制到剪贴板的功能，这对ID和网站上只有一个按钮工作良好。 但我需要对多个按钮和多个带有类标识符的值进行操作，我想，但我真的不知道如何将它从id标识符切换/更改为类标识符，并在一个页面上对多个按钮和输入进行操作。 你能帮帮我吗

这是我的带有ID标识符的HTML按钮，我需要它来让类在多个按钮上工作：

<button type="submit" id="bbcopyButton" class="btn btn-md btn-primary-filled btn-form-submit">BB Code copy</button>

这是通过ID复制的输入，但我需要使其与类一起工作，以便从不同的输入类型复制更多的值：

<input type="text" class="form-control" id="bbcopyTarget" value="valueno.1" name="name" readonly="readonly" onclick="focus();select();">

我希望你明白我想要什么

最后是Javascript代码，应将其切换为类标识符，以便在一个页面上复制多个/多个值：

document.getElementById("bbcopyButton").addEventListener("click", function() {

    copyToClipboardMsg(document.getElementById("bbcopyTarget"), "bbcopyButton");

});

function copyToClipboardMsg(elem, msgElem) {
    var succeed = copyToClipboard(elem);
    var msg;
    if (!succeed) {
        msg = "Press Ctrl+c to copy"
    } else {
        msg = "BB Code copied <i class='lnr lnr-thumbs-up'></i>"
    }
    if (typeof msgElem === "string") {
        msgElem = document.getElementById(msgElem);
    }
    msgElem.innerHTML = msg;
    msgElem.style.background = "green";
    msgElem.style.border = "2px solid green";

    setTimeout(function() {
        msgElem.innerHTML = "BB Code copy";
        msgElem.style.background = "";
        msgElem.style.border = "";

    }, 2000);
}



function copyToClipboard(elem) {
    // create hidden text element, if it doesn't already exist
    var targetId = "_hiddenCopyText_";
    var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA";
    var origSelectionStart, origSelectionEnd;
    if (isInput) {
        // can just use the original source element for the selection and copy
        target = elem;
        origSelectionStart = elem.selectionStart;
        origSelectionEnd = elem.selectionEnd;
    } else {
        // must use a temporary form element for the selection and copy
        target = document.getElementById(targetId);
        if (!target) {
            var target = document.createElement("textarea");
            target.style.position = "absolute";
            target.style.left = "-9999px";
            target.style.top = "0";
            target.id = targetId;
            document.body.appendChild(target);
        }
        target.textContent = elem.textContent;
    }
    // select the content
    var currentFocus = document.activeElement;
    target.focus();
    target.setSelectionRange(0, target.value.length);

    // copy the selection
    var succeed;
    try {
        succeed = document.execCommand("copy");
    } catch(e) {
        succeed = false;
    }
    // restore original focus
    if (currentFocus && typeof currentFocus.focus === "function") {
        currentFocus.focus();
    }

    if (isInput) {
        // restore prior selection
        elem.setSelectionRange(origSelectionStart, origSelectionEnd);
    } else {
        // clear temporary content
        target.textContent = "";
    }
    return succeed;
}

帮点忙就好了。 谢谢

当我有一个ID相同的第二个按钮时，我会让它更清楚一点，Javascript/JQuery代码什么都不做，不能指向第二个输入值 这将是第二个按钮：

<button type="submit" id="bbcopyButton" class="btn btn-md btn-primary-filled btn-form-submit">BB Code copy</button>

以及我要从中复制的第二个输入：

<input type="text" class="form-control" id="bbcopyTarget" value="valueno.2" name="name" readonly="readonly" onclick="focus();select();">

希望这有助于更好地理解此代码：

var but = document.getElementsByClassName('btn btn-md btn-primary-filled btn-form-submit');
var txt = document.getElementsByClassName('form-control');

for (let x=0; x < but.length; x++){
    but[x].addEventListener("click", function() {
        copyToClipboardMsg(txt[x], but[x]);
    }, false);
}

仅当按钮数=txt字段数时，此操作才有效。如果要避免使用let，则需要如下更改：

var but = document.getElementsByClassName('btn btn-md btn-primary-filled btn-form-submit');
var txt = document.getElementsByClassName('form-control');
for (var x = 0; x < but.length; x++) {
  (function(x) {
    but[x].addEventListener("click", function() {
      copyToClipboardMsg(txt[x], but[x]);
    }, false);
  })(x);
}

var but = document.getElementsByClassName('btn btn-md btn-primary-filled btn-form-submit');
var txt = document.getElementsByClassName('form-control');
for (var x = 0; x < but.length; x++) {
  (function(x) {
    but[x].addEventListener("click", function() {
      copyToClipboardMsg(txt[x], but[x]);
    }, false);
  })(x);
}