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

阅读: 评论:0

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

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

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

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

  

本文发布于:2025-04-05 08:38:00,感谢您对本站的认可!

本文链接:https://www.4u4v.net/it/1743813518583937.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

标签:屏蔽   上传文件   拖拽   浏览器   文件
留言与评论(共有 0 条评论)
   
验证码:

Copyright ©2019-2022 Comsenz Inc.Powered by ©

网站地图1 网站地图2 网站地图3 网站地图4 网站地图5 网站地图6 网站地图7 网站地图8 网站地图9 网站地图10 网站地图11 网站地图12 网站地图13 网站地图14 网站地图15 网站地图16 网站地图17 网站地图18 网站地图19 网站地图20 网站地图21 网站地图22/a> 网站地图23