JavaScript 클립보드로 복사하기

1 개요

JavaScript 클립보드로 복사하기

자바스크립트 클립보드 복사

• 자동으로 복사하는 것은 인터넷 익스플로러만 가능
• 플래시를 활용하면 다른 브라우저도 가능 (ZeroClipboard 참고)

IE10 이상, Chrome, Opera, Firefox 모두 자동으로 복사가 가능합니다. ( Chrome 43+, Opera 29+ and IE 10+) 참고함수.

function myFunction() {
  var copyText = document.getElementById("myInput");
  copyText.select();
  document.execCommand("Copy");
  alert("Copied the text: " + copyText.value);
}

2 예시 1: 자동복사

• 인터넷 익스플로러만 가능
• 예제: http://example.zetawiki.com/js/clipboard.php

<script type="text/javaScript">
function copy_to_clipboard(str) {
  window.clipboardData.setData("Text", str);
  alert("복사되었습니다.");
}
</script>

<button onclick="copy_to_clipboard('Hello Jmnote');">복사</button>

3 예시 2: 자동 수동 혼합

• 익스플로러가 아닐 경우 prompt를 띄워 수동으로 복사(Ctrl+C)하도록 함
• 예제: http://example.zetawiki.com/js/clipboard2.php

<script type="text/javaScript">
function is_ie() {
  if(navigator.userAgent.toLowerCase().indexOf("chrome") != -1) return false;
  if(navigator.userAgent.toLowerCase().indexOf("msie") != -1) return true;
  if(navigator.userAgent.toLowerCase().indexOf("windows nt") != -1) return true;
  return false;
}
 
function copy_to_clipboard(str) {
  if( is_ie() ) {
    window.clipboardData.setData("Text", str);
    alert("복사되었습니다.");
    return;
  }
  prompt("Ctrl+C를 눌러 복사하세요.", str);
}
</script>
 
<button onclick="copy_to_clipboard('Hello Jmnote2');">복사</button>

4 같이 보기

• ZeroClipboard
• 클립보드
• 함수 is_ie

5 참고

• http://stackoverflow.com/questions/400212/how-do-i-copy-to-the-clipboard-in-javascript