当textarea字段隐藏时无法复制到剪贴板

Question

我尝试了下面的代码，但当textarea字段使用css display：none时，它不起作用。

我从隐藏的textarea字段中复制文本，但是当我尝试复制时，它什么都不返回。它只有在我删除display：none css时才能正常工作。

我做错了什么或错过了什么？我怎样才能解决这个问题，以使其有效。

＆＃13;

＆＃13;

document.getElementById("copyButton2").addEventListener("click", function() {
        copyToClipboardMsg(document.getElementById("copyTarget2"), "msg");
    });

    function copyToClipboardMsg(elem, msgElem) {
    	  var succeed = copyToClipboard(elem);   
    }
    
    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;
    }

＆＃13;

<textarea id="copyTarget2" style="display:none">dsfsdg</textarea>
<button id="copyButton2">Copy</button>

＆＃13;

＆＃13;

＆＃13;

Answer 1

如果要隐藏元素，请使用visibility:hidden代替display:none。 display:none删除元素。