현재 페이지 주소를 복사하는 간단한 자바스크립트

현재 페이지의 주소를 복사(copy)하는 간단한 자바스크립트(javascript)

 

 

인터넷 익스플로러(Internet Explorer) 9에서는 되는 것을 확인하였으나, 모질라 파이어폭스(Mozilla Firefox)에서는 적용되지 않았습니다.

 

클릭할 버튼이나 글자의 링크 소스에

onClick="javascript:window.clipboardData.setData('Text', location.href)"

를 포함시킵니다.

예를 들면, a  onClick="javascript:window.clipboardData.setData('Text', location.href)" 입니다.

 

 

경고창을 이용하여 주소가 복사된 것을 알리고 싶다면 자바스크립트 소스에 아래를 추가합니다.

두 줄로 쓰려거든 줄과 줄 사이에 \n\ 를 써 주세요. <br>, <br /> 과 같은 역할을 합니다.

 alert('주소가 복사되었습니다.\n\원하는 곳에 붙이세요.')

 

두 자바스크립트의 사이에는 ; 를 꼭 써 주어야 합니다.

 

 

전체 소스는 이러합니다.

<a onClick="javascript:window.clipboardData.setData('Text', location.href);alert('주소가 복사되었습니다.\n\원하는 곳에 ctrl + v 하세요.');">주소 복사하기</a>

 

 

주소 복사하기 테스트 1! 클릭하세요.

 

 

 

글을 좀 꾸며보겠습니다.

 

'주소 복사하기' 위에 마우스를 가져갔을 때 손가락 모양으로 바뀌게 하여 클릭 가능하다는 것을 알려주고 싶을 때는,

style="cursor:pointer"

를 추가로 써줍니다. 익스플로러와 파이어폭스에서 실행됩니다.

주소 복사하기 테스트 2! 클릭하세요.

 

그렇다면, '주소 복사하기' 글자 앞에 해당 페이지의 실제 주소가 적히게 하고 싶다면,

<script type=text/javascript>
<!--
document.write(document.URL);
// -->
</script>

혹은 글씨를 추가하여

<script language=javascript type=text/javascript>
<!--
document.write("주소 : "document.URL);
// -->
</script>

 

 

모두 함께 적어보면,

 

<a onClick="javascript:window.clipboardData.setData('Text', location.href);alert('주소가 복사되었습니다.\n\원하는 곳에 ctrl + v 하세요.');" style="cursor:pointer">주소 복사하기</a>

<script type=text/javascript>
<!--
document.write(document.URL);
// -->
</script>

주소까지 포함해서 함께 클릭이 가능하도록 하려면,

 <a onClick="javascript:window.clipboardData.setData('Text', location.href);alert('주소가 복사되었습니다.\n\원하는 곳에 ctrl + v 하세요.');" style="cursor:pointer">주소 복사하기

<script type=text/javascript>
<!--
document.write(document.URL);
// -->
</script></a>

 

주소 복사하기 테스트 3! 클릭하세요.