[javascript] FireFox, Safari 및 Chrome으로 클립 보드에 텍스트 복사 / 넣기

Internet Explorer에서 나는 클립 보드에 액세스하기 위해 clipboardData 객체를 사용할 수 있습니다. FireFox, Safari 및 / 또는 Chrome에서 어떻게 할 수 있습니까?



답변

이제 대부분의 최신 브라우저에서이 작업을 쉽게 수행 할 수있는 방법이 있습니다.

document.execCommand('copy');

현재 선택된 텍스트를 복사합니다. 다음을 사용하여 textArea 또는 입력 필드를 선택할 수 있습니다.

document.getElementById('myText').select();

텍스트를 보이지 않게 복사하려면 textArea를 빠르게 생성하고, 상자에서 텍스트를 수정하고, 선택하고, 복사 한 다음 textArea를 삭제할 수 있습니다. 대부분의 경우이 textArea는 화면에 깜박이지 않습니다.

보안상의 이유로 브라우저는 사용자가 어떤 종류의 작업 (예 : 버튼 클릭)을 수행하는 경우에만 복사를 허용합니다. 이를 수행하는 한 가지 방법은 텍스트를 복사하는 메서드를 호출하는 html 버튼에 onClick 이벤트를 추가하는 것입니다.

전체 예 :

function copier(){
  document.getElementById('myText').select();
  document.execCommand('copy');
}
<button onclick="copier()">Copy</button>
<textarea id="myText">Copy me PLEASE!!!</textarea>


답변

보안상의 이유로 Firefox는 클립 보드에 텍스트를 넣는 것을 허용하지 않습니다. 그러나 Flash를 사용하는 해결 방법이 있습니다.

function copyIntoClipboard(text) {

    var flashId = 'flashId-HKxmj5';

    /* Replace this with your clipboard.swf location */
    var clipboardSWF = 'http://appengine.bravo9.com/copy-into-clipboard/clipboard.swf';

    if(!document.getElementById(flashId)) {
        var div = document.createElement('div');
        div.id = flashId;
        document.body.appendChild(div);
    }
    document.getElementById(flashId).innerHTML = '';
    var content = '<embed src="' +
        clipboardSWF +
        '" FlashVars="clipboard=' + encodeURIComponent(text) +
        '" width="0" height="0" type="application/x-shockwave-flash"></embed>';
    document.getElementById(flashId).innerHTML = content;
}

유일한 단점은 Flash를 활성화해야한다는 것입니다.

소스는 현재 죽었습니다 : http://bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/ ( Google 캐시도 마찬가지입니다. )


답변

온라인 스프레드 시트는 Ctrl + C, Ctrl + V 이벤트를 연결하고 포커스를 숨겨진 TextArea 컨트롤로 전송하고 해당 내용을 복사 할 새 클립 보드 내용으로 설정하거나 이벤트가 붙여 넣기를 완료 한 후 내용을 읽습니다.

또한 참조 는 자바 스크립트를 사용하여 파이어 폭스, 사파리와 크롬에서 클립 보드를 읽을 수 있습니까?


답변

2015 년 여름, Flash를 둘러싼 혼란이 너무 많아서이 질문에 대한 새로운 답변을 추가하여 완전히 사용하지 않을 것이라고 생각했습니다.

클립 보드 .js는 텍스트 또는 html 데이터를 클립 보드에 복사 할 수있는 멋진 유틸리티입니다. 사용하기 매우 쉽습니다. .js를 포함하고 다음과 같이 사용하십시오.

<button id='markup-copy'>Copy Button</button>

<script>
document.getElementById('markup-copy').addEventListener('click', function() {
  clipboard.copy({
    'text/plain': 'Markup text. Paste me into a rich text editor.',
    'text/html': '<i>here</i> is some <b>rich text</b>'
  }).then(
    function(){console.log('success'); },
    function(err){console.log('failure', err);
  });

});
</script>

클립 보드 .jsGitHub있습니다.


답변

2017 년에는 이렇게 할 수 있습니다 (이 스레드는 거의 9 년이 되었기 때문에 이렇게 말하세요!)

function copyStringToClipboard (string) {
    function handler (event){
        event.clipboardData.setData('text/plain', string);
        event.preventDefault();
        document.removeEventListener('copy', handler, true);
    }

    document.addEventListener('copy', handler, true);
    document.execCommand('copy');
}

이제 복사하려면 copyStringToClipboard('Hello World')

setData선 을 발견하고 다른 데이터 유형을 설정할 수 있는지 궁금하다면 대답은 ‘예’입니다.


답변

Firefox에서는 클립 보드에 데이터를 저장할 수 있지만 보안상의 이유로 기본적으로 비활성화되어 있습니다. “클립 보드에 대한 JavaScript 액세스 권한 부여” 에서 활성화하는 방법을 참조하십시오.Mozilla Firefox 기술 자료의 .

amdfan에서 제공하는 솔루션은 사용자가 많고 브라우저를 구성 할 수없는 경우에 가장 적합합니다. 사용자가 기술에 정통한 경우 클립 보드를 사용할 수 있는지 테스트하고 설정 변경 링크를 제공 할 수 있습니다. JavaScript 편집기 TinyMCE 는이 접근 방식을 따릅니다.


답변

copyIntoClipboard () 함수는 Flash 9에서 작동하지만 Flash Player 10의 출시로 인해 손상된 것 같습니다. 다음은 새 Flash Player에서 작동하는 솔루션입니다.

http://bowser.macminicolo.net/~jhuckaby/zeroclipboard/

복잡한 솔루션이지만 작동합니다.