Question

我正在尝试实现拖放div，例如this。不幸的是，它对我不起作用，当我尝试拖动到这个div时，会打开一个包含所选文件的新选项卡。这是我的代码

       //Add row
       table.row.add(.....).draw();

        //Create you row datepicker
        $('#strtbuydat_'+id).datepicker({
            format: "dd/mm/yyyy",
            todayBtn: true,
            language: "fr",
            forceParse: false,
            autoclose: true,
            todayHighlight: true,
            onRender: function(date) {
                return date.valueOf() < now.valueOf() ? 'disabled' : '';
            }
        });

我怎样才能让它发挥作用？

Answer 1

＆＃13;

var dropbox;
dropbox = document.getElementById("dropbox");
dropbox.addEventListener("dragenter", dragenter, false);
dropbox.addEventListener("dragover", dragover, false);
dropbox.addEventListener("drop", drop, false);

function dragenter(e) {
  e.stopPropagation();
  e.preventDefault();
}

function dragover(e) {
  e.stopPropagation();
  e.preventDefault();
}
  
function drop(e) {
  e.stopPropagation();
  e.preventDefault();
  var dt = e.dataTransfer;
  var files = dt.files;
  handleFiles(files);
}

＆＃13;

#dropbox
{
  height: 100px;
  border: 4px double black;
  background-color: lightgray;
  font: 5em bold monospace;
  text-align: center;
}

＆＃13;

<div id="dropbox">
  Drag files here!
</div>

＆＃13;

Google链接已过时，但this允许文件系统以非常类似的方式工作。上面就是一个例子。

谷歌拖放不起作用

1 个答案: