2017-12-18 38 views
0

다른 사용자가 테이블 셀을 클릭 할 수있게 해주는 멋진 스크립트를 도와 주었고 그 내용이 클립 보드에 복사됩니다. 나는 그것을 완전히 이해하지 못하고 있지만 효과가있다. 나는이 프로그램에 뭔가를 추가하고 싶다. 여기 .. ​​제 원래 프로그램 javascript를 사용하여 입력 필드에 붙여 넣기 할 수 있습니다.

document.addEventListener('click', (e) => { 
 
    let target = e.target; 
 

 
    if(target.localName === 'td') { 
 
    let range = document.createRange(); 
 
    range.selectNodeContents(target); 
 
    let sel= document.getSelection(); 
 
    sel.removeAllRanges(); 
 
    sel.addRange(range); 
 
    document.execCommand('copy'); 
 
    sel.removeAllRanges(); 
 
    target.classList.add('copy-animate'); 
 
    setTimeout(() => {target.classList.remove('copy-animate');}, 300); 
 
    } 
 
});
.copy-animate {background:#F00} 
 
td {cursor:pointer;border:1px solid black} 
 
input {border:1px solid black;width:200px}
Click a table cell to copy<br> 
 
<table><td>milk</td><td>bread</td><td>eggs</td><td>cheese</td></table> 
 

 
<br>This is the pasting area. Try pasting here.<br> 
 
<input type="text">

프로그램은 위 TD 복사 그것에 클릭을 수신

. 이제는 INPUT에서 클릭을 듣고 싶을 때 붙여 넣기를 수행합니다. 나는 아래와 같은 유사한 IF 문을 추가 할 수 있다고 생각했지만 작동하지 않았다. 도와주세요. 따라서 최종 결과를 통해 단 두 번의 클릭만으로 테이블 셀에서 입력 필드로 복사 할 수 있습니다. 마우스 오른쪽 버튼을 클릭하여 메뉴에서 붙여 넣기를 선택하거나 CTRL-V를 사용하고 싶지 않습니다.

if(target.localName === 'input') { 
    let range = document.createRange(); 
    range.selectNodeContents(target); 
    let sel= document.getSelection(); 
    sel.removeAllRanges(); 
    sel.addRange(range); 
    document.execCommand('paste'); 
    sel.removeAllRanges(); 
    } 
+0

시도해 본 경우 target_tagName은 무엇입니까? –

+0

자바 스크립트를 처음 접했으므로이 기능을 프로그램에 추가하는 방법을 모르겠습니다. – CheeseFlavored

+0

target.localName을 target.tagName으로 바꾸고 얻은 것을 확인하십시오. –

답변

2

내가 아는 한 프로그래밍 방식으로 js에서 붙여 넣기를 수행 할 수 없습니다. 그것은 보안 조치입니다.

대신 수행 할 수있는 작업은 포커스가있는 요소를 추적하고 복사 이벤트를 수신하는 것입니다. 그런 다음 원본 요소의 입력 값 또는 innerHTML을 확인하고 대상 요소에 넣는 방법으로 내용을 가져올 수 있습니다.

+0

사실, [붙여 넣기 이벤트] (https://developer.mozilla.org/en-US/docs/Web/API/ClipboardEvent/ClipboardEvent)를 프로그래밍 방식으로 트리거 할 수 있지만, 사용자의 클립 보드 데이터에 액세스하려면 프로그래밍 방식으로이 이벤트 데이터를 직접 채워야합니다. – Kaiido