그누보드 QA - 클립보드 주소복사버튼을 ..문제가 있어서 좀 봐주셨으면 감사하겠습니다.

클립보드 주소복사버튼을 ..문제가 있어서 좀 봐주셨으면 감사하겠습니다.

헛둘헛둘 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2022.03.01 10:11:56 조회 1102 (219.♡.♡.183)

본문

클립보드 주소 복사 하기를 우성님 자료를 보고 했거든요.

우성님 홈페이지 : https://www.wsgvet.com/home/474

방법을 간단히 요약하자면

1. clipboard.min.js 파일을 다운받아서 js폴더에 넣어두기

2. 게시판 view에 스크립트를 넣기


<!--클립보드 JS 및 스타일 설정 시작-->
<script src="../js/clipboard.min.js"></script>
<script>
    var clipboard = new Clipboard('.btn-clipboard', {
        text: function() {
            return 'http://<?php echo $_SERVER[HTTP_HOST].$_SERVER[REQUEST_URI]; ?>';
        }
    });
    clipboard.on('success', function(e) {
        console.log(e);
    });
    clipboard.on('error', function(e) {
        console.log(e);
    });
</script>
<style>
    button.btn-clipboard {display:inline-block;margin:0;padding:7px;line-height:12px;border:1px solid #ccc;background:#FFFFFF;color:#000;text-decoration:none}
    button.btn-clipboard:focus, button.btn-clipboard:hover {color:#FF0000;}
</style>
<!--클립보드 JS 및 스타일 설정 끝-->

3. 버튼 넣기


<?php if(G5_IS_MOBILE) {?>
<button class="btn-clipboard cursor at-tip" data-toggle="tooltip" data-trigger="hover" data-placement="top" data-original-title="주소가 복사되었습니다.">주소복사</button>
<?php } ?>
<?php if(!G5_IS_MOBILE) {?>
<button class="btn-clipboard cursor at-tip" data-toggle="tooltip" data-trigger="click focus" data-placement="top" data-original-title="주소가 복사되었습니다.">주소복사</button>
<?php } ?>

그런데..실제 설치는 끝났는데 반응이 없더라구요. 복사가 안된다는것이겠죠.

그래서 개발자 모드로 살펴봤는데

이렇게 uncaught typeError 가 나오더라구요.

내용위치를 가서 보니깐...아래와 같이 나와있는데...

3690604471_1646096994.3809.png

저는 까막눈이라서 그런지....이게 왜 문제인지 모르겠어요 ㅠ.ㅠ

#그누보드5 #주소복사

답변 2

들레아빠 홈페이지 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2022-03-01 17:42:08 116.♡.♡.69


<?php
    echo '<a href="#" style="clear:both"><input id="copyInput" type="text" style="display:none"></a><span style=float:right;cursor:pointer onclick=copyMode("'.$_SERVER[HTTP_HOST].$_SERVER[REQUEST_URI].'","글주소가")><i class="fa fa-share-alt" title="http://'.$_SERVER[HTTP_HOST].$_SERVER[REQUEST_URI].' 주소복사"></i>';
    echo '<script>function copyMode(){copyInput.style.display = "block";copyInput.value = arguments[0];copyInput.select();document.execCommand("copy");copyInput.style.display = "none";alert(arguments[1] + " 복사되었습니다");}</script></span>';
?>

이걸로 시험해 보세요.