html5 拖拽上传文件时,屏蔽浏览器默认打开文件

我们在使用html5的拖拽上传时,做法往往是监听一个控件范围内的drop事件。但是用户在操作的时候往往会出现文件没有进入到控件范围内就释放的情况,这种情况在以下浏览器中会出现不同的情况,下面是实验结果: chrome: 如果该文件是浏览器可

  我们在使用html5的拖拽上传时,做法往往是监听一个控件范围内的drop事件。但是用户在操作的时候往往会出现文件没有进入到控件范围内就释放的情况,这种情况在以下浏览器中会出现不同的情况,下面是实验结果:

    chrome: 如果该文件是浏览器可浏览文件(图片等),浏览器会在当前窗口打开文件的预览;如果是不可浏览文件,则会触发浏览器的下载

    fireFox: 如果该文件是浏览器可浏览文件(图片等),浏览器会在新窗口打开文件的预览;如果是不可浏览文件,则会触发浏览器的下载
    IE: 如果该文件是浏览器可浏览文件(图片等),浏览器会在当前窗口打开文件的预览;如果是不可浏览文件,则会触发浏览器的下载

  我们最不能接受的就是在 chrome 和 ie中的表现,因为我们的页面会被覆盖,填写的内容会丢失,为了避免这种情况的出现,我们需要做一些处理。说白了就是通过禁用浏览器的默认行为来禁止浏览器触发drop事件。代码如下所示:

  

发布者:admin,转转请注明出处:http://www.yc00.com/web/1743813516a4511477.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信