我如何制作div来拖放?

时间:2016-03-30 18:27:24

标签: javascript html5 drag-and-drop

我可以从浏览器外部拖动图片并使用此脚本放入div:

function makeDragAndDrop(holder){
            holder.ondragover = function (e){ 
                e.preventDefault();
                this.classList.add('hover');
            };

            holder.ondragleave = function(e){
                e.preventDefault();
                this.classList.remove('hover');
            }

            holder.ondragend = function (e) { 
                e.preventDefault();
                this.classList.remove('hover');
            };

            holder.ondrop = function (e) {
                this.classList.remove('hover');
                e.preventDefault();

                var file = e.dataTransfer.files[0],
                    reader = new FileReader();

                reader.onload = function (event) {
                    console.log(event.target);
                    holder.style.backgroundImage = 'url(' + event.target.result + ')';
                    holder.style.border = '0px';
                    holder.draggable = 'true';
                };
                console.log(file);
                reader.readAsDataURL(file);

                return false;
            };
        }

        var akt = 'holder';
        var ID, aktID;

        for(ID = 0; ID < 5; ID++) {
            aktID = akt +ID;
            makeDragAndDrop(document.getElementById(aktID));
        }

如何从div(不在浏览器之外)拖动图像并将其拖放到另一个div中? 例如:我将图像放入第三个div。如何将此图像放入第二个div中,并通过一次拖放从第三个div中删除?

我应该重新排序div而不是拖放吗?

0 个答案:

没有答案
相关问题