您的位置:首页 > Web前端 > HTML5

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

2014-12-13 23:20 1466 查看
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

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐