본문 바로가기

Language/Javascript & JQuery

execCommand('copy')

 

 

-Document.execCommand('copy')

: 인자 명령어에 따라 다양한 기능이 있다ㅏㅏ

copy 기능은 클립보드 복사 기능

 

ex)

<div class="input-group mb-3">
<input type="text" class="form-control depositADD text-center" id="address"
value=" **시 **동 **** " disabled="">
</div>

<div class="input-group mb-3">
<button type="button" class="AddressCopy"
onclick="copy(document.getElementById('address').value)">주소 복사</button>
</div>

<script>

// 복사할 내용을 위의 버튼 태그 내에서나, script내에서 해당 메소드의 인자로 잡아줌
function copy(val) {

    // textarea 태그 생성
    let copyTxt = document.createElement("textarea");
    
    // 해당 태그를 바디에 추가
    document.body.appendChild(copyTxt);
    
    // 만들어준 객체에 value 속성에 받은 인자 값을 할당
    copyTxt.value = val;
    
    // 해당 객체에 강조 표시 ( 전체선택 )
    copyTxt.select();
    
    // 만들어진 객체에 클립보드에 복사
    document.execCommand("copyTxt");
    
    // 만들어진 객체 삭제
    document.body.removeChild(copyTxt);
    
    alert('복사되었습니다.');
}

</script>