<p id="drag" draggable="true">드래그해보세요.</p>
<br>
<div id="drop">여기에 드롭하세요</p>
document.getElementById('drag').ondragstart = function(e) {
console.log('드래그 시작');
e.dataTransfer.setData('data', this.innerHTML);
e.dataTransfer.dropEffect = 'copy';
};
var drop = document.getElementById('drop');
drop.ondragover = function(e) {
e.preventDefault(); // 필수
console.log('무언가 위에 올려져 있습니다');
e.dataTransfer.dropEffect = 'move';
};
drop.ondrop = function(e) {
console.log('무언가 드롭되었습니다.');
alert(e.dataTransfer.getData('data'));
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.