[Javascript] 클립보드 복사

2019. 5. 13. 15:34JAVASCRIPT

javascript 로 해쉬태그 복사를 위하여 클립보드 복사 기능을 사용중 이슈가 발생

이상하게 PC , 모바일 Android 에서는 되는데 IOS 에서 복사가 되지 않는 문제가 발생됨

찾아보다가 clipboardjs 라이브 러리 발견 하여 공유하고자 포스팅 합니다.

https://clipboardjs.com/

 

사용법은 매우 간단합니다.

라이브러리를 다운받은후

 

<script>
var clipboard = new ClipboardJS('#copyHash');
</script>

<button type="button" id="copyHash" data-clipboard-text="#테스트 #페이스북 #트위터">
    COPY
</button>

와 같이 사용하면 됩니다.

data-clipboard-text 부분이 복사되어집니다.

클립보드 복사후 alert 창등을 띄워주기 위하여 아래와 같이 사용하면 됩니다.

 

<script src="/javascript/front/ko/mo/event.js"></script>

<script>
    var clipboard = new ClipboardJS('#copyHash');

	clipboard.on('success', function(e) {
		alert("복사되었습니다.");
		e.clearSelection();
	});

	clipboard.on('error', function(e) {
		alert("에러");
	});
</script>

<button type="button" id="copyHash" data-clipboard-text="#테스트 #페이스북 #트위터">
    COPY
</button>