Microsoft MVP성태의 닷넷 이야기
글쓴 사람
정성태 (techsharer at outlook.com)
홈페이지
첨부 파일
 

(시리즈 글이 4개 있습니다.)
웹: 34. Edge 브라우저도 지원하는 클립보드 복사를 위한 자바스크립트 코드
; https://www.sysnet.pe.kr/2/0/11093

.NET Framework: 841. Windows Forms/C# - 클립보드에 RTF 텍스트를 복사 및 확인하는 방법
; https://www.sysnet.pe.kr/2/0/11929

.NET Framework: 858. C#/Windows - Clipboard(Ctrl+C, Ctrl+V)가 동작하지 않는다면?
; https://www.sysnet.pe.kr/2/0/12009

닷넷: 2333. C# - (Console 유형의 프로젝트에서) Clipboard 연동
; https://www.sysnet.pe.kr/2/0/13925




Edge 브라우저도 지원하는 클립보드 복사를 위한 자바스크립트 코드

제 웹 사이트에서 글 읽기를 해보면, 제목 옆에 "링크 복사"라는 것을 두었습니다. Internet Explorer까지만 해도 그 버튼을 누르면 클립보드에 복사할 수 있었는데 Edge 웹 브라우저로 오면서 그 기능이 동작하지 않게 되었습니다.

이제 좀 바뀌었을까 싶어서 검색해 봤더니... ^^ 오호, Edge까지 지원하는 클립보드 자바스크립트 코드가 있습니다. ^^

clipboard.js
; https://clipboardjs.com/
; https://github.com/zenorocha/clipboard.js

적용도 매우 쉽습니다.

다음의 압축 파일을 받아 해제하고,

clipboard.js
; https://github.com/zenorocha/clipboard.js/archive/master.zip

/dist 폴더에 있는 clipboard.min.js 파일을 복사해 여러분들의 웹 사이트에 추가하고, 원하는 페이지에 script 태그로 연결합니다.

<script type="text/javascript" src="/scripts/clipboard.min.js"></script>

그다음, 사용자가 click 동작을 했을 때 클립보드로 텍스트를 복사할 HTML 요소를 명시하는 스크립트를 작성합니다.

<span id="clipboardButton" data-clipboard-text="test is good"" style="cursor: pointer">복사</span>

<script type="text/javascript">
var clipboard = new Clipboard('#clipboardButton');
</script>

위의 스크립트는 span 영역을 사용자가 마우스로 누르면, 즉 "복사"라는 텍스트를 마우스로 누르면 span 태그 내 "data-clipboard-text" 요소의 텍스트인 "test is good" 문자열을 클립보드로 복사해 줍니다. (그 외에도 다양한 문자열 복사 방식을 지원하는데 자세한 것은 문서를 참고하세요.)




이 라이브러리는 Selection과 execCommand API에 의존한다고 하는데, Selection의 경우 현재 모든 브라우저에서 지원된다고 하며 execCommand의 경우 Chrome 42+, Edge 12+, Firefox 41+, IE 9+, Opera 29+, Safari 10+에서 지원한다고 합니다.

그런데, Edge에 버전이 있었나요?

확인해 보니까 Settings 부분에 다음과 같이 EdgeHTML이라는 것으로 14.14393이라는 버전이 있습니다.

edge_clipboard_1.png

아마도 저것이 Edge의 버전이 아닐까 싶습니다. ^^




[이 글에 대해서 여러분들과 의견을 공유하고 싶습니다. 틀리거나 미흡한 부분 또는 의문 사항이 있으시면 언제든 댓글 남겨주십시오.]







[최초 등록일: ]
[최종 수정일: 3/28/2025]

Creative Commons License
이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-변경금지 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
by SeongTae Jeong, mailto:techsharer at outlook.com

비밀번호

댓글 작성자
 




... 151  152  153  [154]  155  156  157  158  159  160  161  162  163  164  165  ...
NoWriterDateCnt.TitleFile(s)
1266정성태3/14/201237199개발 환경 구성: 149. RAID 1 구성 시 하드 디스크 장애 발생 해결에 대한 경험담
1265정성태3/13/201227539VC++: 61. 아이태니엄(IA64: Itanium) 에서 겪은 C++ 포인터 연산 문제 [2]
1264정성태3/10/201247469.NET Framework: 313. WELL512 난수 발생 알고리즘 - C# [5]파일 다운로드1
1263정성태3/9/201225681개발 환경 구성: 148. tinyget 사용법
1262정성태3/8/201246534개발 환경 구성: 147. .keystore 파일에 저장된 개인키 추출 방법과 인증기관으로부터 온 공개키를 합친 pfx 파일 만드는 방법 [1]
1261정성태3/7/201226948Phone: 2. 개발자용 윈도우 폰 7 기기 등록하는 방법
1260정성태3/6/201227273Phone: 1. 윈도폰 7 개발자 (회사) 등록하는 방법 [3]
1259정성태3/4/201238824Windows: 57. 새로 추가된 네트워크 커널 디버깅 및 PowerShell 3.0 [1]
1258정성태3/3/201240310개발 환경 구성: 146. SQL Server 2012에 포함된 LocalDB 기능 소개 [3]파일 다운로드1
1257정성태3/3/201228773.NET Framework: 312. Native 스레드와 Managed 스레드 개체의 상태 관계 [1]파일 다운로드1
1256정성태3/3/201232013Math: 5. Euler's totient function - C#파일 다운로드1
1255정성태3/3/201234173Math: 4. 소수 판정 및 소인수 분해 소스 코드 - C# [1]파일 다운로드1
1254정성태3/1/201229688Windows: 56. Windows 8 Consumer Preview를 사용해 보고... [1]
1253정성태3/1/201231080VS.NET IDE: 71. Visual Studio 11 Ultimate 베타 설치 [3]
1252정성태3/1/201228252Windows: 55. 윈도우 8 베타 설치 과정 [1]
1251정성태2/27/201232041VC++: 60. C/C++ Native 스레드 콜 스택 덤프를 얻는 공개 라이브러리 [2]파일 다운로드1
1250정성태2/27/201234558VC++: 59. C/C++ 프로젝트 빌드 속도 개선 - UnityBuild를 아세요? [3]
1249정성태2/26/201234600.NET Framework: 311. .NET 스레드 콜 스택 덤프 (5) - ICorDebug 인터페이스 사용법 [2]파일 다운로드3
1248정성태2/25/201245460.NET Framework: 310. C#의 Shift 비트 연산 정리파일 다운로드1
1247정성태2/25/201228300.NET Framework: 309. .NET 응용 프로그램에 기본 생성되는 스레드들에 대한 탐구 [1]파일 다운로드1
1246정성태2/25/201227586개발 환경 구성: 145. 한영 변환은 되지만, 정작 한글 입력이 안되는 경우
1245정성태2/25/201238650개발 환경 구성: 144. 윈도우에서도 유닉스처럼 명령행으로 원격 접속하는 방법
1244정성태2/24/201235737.NET Framework: 308. .NET System.Threading.Thread 개체에서 Native Thread Id를 구할 수 있을까? [1]파일 다운로드1
1243정성태2/23/201235675개발 환경 구성: 143. Visual Studio 2010 - .NET Framework 소스 코드 디버깅 - 두 번째 이야기 [1]
1242정성태2/20/201242259VC++: 58. API Hooking - 64비트를 고려해야 한다면? EasyHook! [7]파일 다운로드1
1241정성태2/20/201228730.NET Framework: 307. .NET 4.0 응용 프로그램을 위한 ILMerge
... 151  152  153  [154]  155  156  157  158  159  160  161  162  163  164  165  ...