atitit.D&D drag&drop拖拽文件到界面功能 html5 web 跟个java swing c#.net c++ 的总结

atitit.D&D drag&drop拖拽文件到界面功能 html5 web 跟个java swing c#.net c++ 的总结

1. DND的操作流程 1

2. Html5 注解事件 document.dragover >>preventDefault 1

3. 代码(js) 1

4. C++ 实现拖曳 2

5. QT拖拽功能简介 - pcsuite的专栏 - 博客频道 - CSDN.NET.htm 2

1. DND的操作流程

Dragenter 事件::更改提示的颜色..自动改变光标状态指示用户当前的控件是否是一个合法的drop地点

dragleave事件::更改提示的颜色.

 Drop 事件:处理文件..不过,好像html子能有文件名称,马文件路径..

注释::::拖曳距离,,  如果这个距离大于QApplication认定的拖动的最小距离（通常为四个象素），调用私有函数startDrag()开始拖动。通过判断距离可以避免因为用户手抖动引起的误操作

作者:: 老哇的爪子 Attilax 艾龙，  EMAIL:1466519819@qq.com

转载请注明来源： http://blog.csdn.net/attilax

2. Html5 注解事件 document.dragover >>preventDefault

调用 preventDefault() 来避免浏览器对数据的默认处理（drop 事件的默认行为是以链接形式打开）

3. 代码(js)

<script>

handleFiles = function(files) { 

    for (var i = 0; i < files.length; i++) { 

        var file = files[i]; 

alert("aa"+file);

   

    } 

}  

document.addEventListener("dragenter", function(e){ 

    dropbox.style.borderColor = 'gray'; 

}, false); 

document.addEventListener("dragleave", function(e){ 

    dropbox.style.borderColor = 'silver'; 

}, false); 

document.addEventListener("dragover", function(e){ 

    e.stopPropagation(); 

    e.preventDefault(); 

}, false); 

document.addEventListener("drop", function(e){ 

    e.stopPropagation(); 

    e.preventDefault(); 

       alert(e.dataTransfer.files);

    handleFiles(e.dataTransfer.files); 

       

  //  submit.disabled = false; 

}, false); 

4. C++ 实现拖曳

雅十enter跟个drag事件..

void MainWindow::dragEnterEvent(QDragEnterEvent *event)

{

    if (event->mimeData()->hasFormat("text/uri-list"))

        event->acceptProposedAction();

}

void MainWindow::dropEvent(QDropEvent *event)

{

    QList<QUrl> urls = event->mimeData()->urls();

    if (urls.isEmpty())

       return;

    QString fileName = urls.first().toLocalFile();

    if (fileName.isEmpty())

参考

HTML5文件实现拖拽上传 - caonidayecnblogs - 博客园.htm

5. QT拖拽功能简介 - pcsuite的专栏 - 博客频道 - CSDN.NET.htm