复制到剪贴板多个项目

时间:2015-06-01 08:50:16

标签: jquery html css copy clipboard

我正在复制到剪贴板,但它只是拿起第一个ID。我理解的是因为你不能拥有多个ID但是当我将代码更改为document.getElementsByClassName时它不起作用?

以下是我的代码

 function CopyToClipboard() {
        var input = document.getElementById("toClipboard");
        var textToClipboard = input.value;

        var success = true;
        if (window.clipboardData) { // Internet Explorer
            window.clipboardData.setData("Text", textToClipboard);
        }
        else {
            // create a temporary element for the execCommand method
            var forExecElement = CreateElementForExecCommand(textToClipboard);

            /* Select the contents of the element
                (the execCommand for 'copy' method works on the selection) */
            SelectContent(forExecElement);

            var supported = true;

            // UniversalXPConnect privilege is required for clipboard access in Firefox
            try {
                if (window.netscape && netscape.security) {
                    netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
                }

                // Copy the selected content to the clipboard
                // Works in Firefox and in Safari before version 5
                success = document.execCommand("copy", false, null);
            }
            catch (e) {
                success = false;
            }

            // remove the temporary element
            document.body.removeChild(forExecElement);
        }

        if (success) {
            alert("The text is on the clipboard");
        }
        else {
            alert("Your browser doesn't allow clipboard access!");
        }
    }

    function CreateElementForExecCommand(textToClipboard) {
        var forExecElement = document.createElement("div");
        // place outside the visible area
        forExecElement.style.position = "absolute";
        forExecElement.style.left = "-10000px";
        forExecElement.style.top = "-10000px";
        // write the necessary text into the element and append to the document
        forExecElement.textContent = textToClipboard;
        document.body.appendChild(forExecElement);
        // the contentEditable mode is necessary for the  execCommand method in Firefox
        forExecElement.contentEditable = true;

        return forExecElement;
    }

    function SelectContent(element) {
        // first create a range
        var rangeToSelect = document.createRange();
        rangeToSelect.selectNodeContents(element);

        // select the contents
        var selection = window.getSelection();
        selection.removeAllRanges();
        selection.addRange(rangeToSelect);
    }

这是我的HTML;

<div id="App-Details"><span>Activation Guid</span><br /><br />
<input id="toClipboard" value="@appDetails.ActivationGuid"> <button onclick='CopyToClipboard ()'>Copy Guid</button></div>

感谢。

0 个答案:

没有答案