url복사
전에 알던 방식은 IE에서만 가능했는데, 이번 방식은 크롬, IE 모두 지원되요.
html
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>URL 복사</title> </head> <body> <button type="button" id="sh-link">주소복사</button> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> </body> </html>
jQuery
$(document).on("click", "#sh-link", function(e) { // 링크복사 시 화면 크기 고정 $('html').find('meta[name=viewport]').attr('content', 'width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no'); var html = "<input id='clip_target' type='text' value='' style='position:absolute;top:-9999em;'/>"; $(this).append(html); var input_clip = document.getElementById("clip_target"); //현재 url 가져오기 var _url = $(location).attr('href'); $("#clip_target").val(_url); if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) { var editable = input_clip.contentEditable; var readOnly = input_clip.readOnly; input_clip.contentEditable = true; input_clip.readOnly = false; var range = document.createRange(); range.selectNodeContents(input_clip); var selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range); input_clip.setSelectionRange(0, 999999); input_clip.contentEditable = editable; input_clip.readOnly = readOnly; } else { input_clip.select(); } try { var successful = document.execCommand('copy'); input_clip.blur(); if (successful) { alert("URL이 복사 되었습니다. 원하시는 곳에 붙여넣기 해 주세요."); // 링크복사 시 화면 크기 고정 $('html').find('meta[name=viewport]').attr('content', 'width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=yes'); } else { alert('이 브라우저는 지원하지 않습니다.'); } } catch (err) { alert('이 브라우저는 지원하지 않습니다.'); } }); //클립보드 복사
728x90
'프로그램 강좌' 카테고리의 다른 글
| [react.js]axios 외부 데이터 연동하기 (0) | 2020.04.16 |
|---|---|
| [react.js]게시판 만들기1 (0) | 2020.04.16 |
| [폰트리뷰]포스트비쥬얼 폰트 리뷰 (0) | 2020.02.26 |
| [mysql]비밀번호 변경 방법 (0) | 2020.02.08 |
| [git]yarn eject 안될때 해결방법 (0) | 2020.01.31 |
