在GWT中拖放文件上传无法在IE 11,MS Edge

时间:2015-09-28 16:03:49

标签: html5 gwt file-upload

我有一个为客户端构建的现有GWT项目,它具有通过良好的旧文件对话上传多个文件的功能。它适用于所有浏览器。 我想添加一个功能,以提供一个小的删除区域,用户可以删除文件并期望它们被上传。我希望通过对现有代码的最小更改来完成此操作,因此我快速搜索了对File API的GWT支持。它似乎仍处于试验状态。

然后我回顾了这些问题 Drag and Drop file upload with GWT

GWT Drag and Drop File Upload not working

File upload with a progress bar, or accessing the Html 5 File Api from Google Web Toolkit?

感谢第一个问题,我找到了Moxie集团的gwt-uploader库。我在我的代码中实现了它,它就像Firefox上的魅力一样。 它在Chrome上运行良好。 遗憾的是无法在IE 11和MS Edge浏览器上运行。

我使用了展示案例示例多文件上传,其中包含进度条和拖放,http://www.moxiegroup.com/moxieapps/gwt-uploader/showcase/index.jsp作为我的代码的基础。 此示例也不适用于IE 11和MS Edge。

任何想法可能出错?

1 个答案:

答案 0 :(得分:2)

回答我自己的问题,以便对可能遇到类似问题的人有所帮助。 由于Moxie GWT-uploader代码在大约3年内没有更新,我怀疑该库存在问题,但经过几天的搜索而没有找到任何其他有用的替代库我决定尝试修复Moxie。结果我完全错了。 当我开始谷歌搜索IE 11,MS Edge支持拖放(我认为这显然是支持,因为这些是现代浏览器),并发现什么是错误的。

  1. MS Edge - 目前尚不支持拖放文件 这个问题已在这个问题中得到解答 - Microsoft Edge html5 file drag and drop拖放 从那里我找到了MS Edge Developer建议网站的方式,显然它仍处于开发阶段。找到答案的人...如果MS Edge仍然不支持此功能,请在下面的链接中投票。 https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/8964523-support-html5-drag-and-drop-of-files-from-explorer
  2. IE 11 - 支持拖放。但是我使用gwt-uploader演示来创建我的源代码,结果是drop label缺少一个height属性。这是原始来源。

    <div class="dropFilesLabel">Drop Files Here</div>
    

    类dropFilesLabel样式

    .dropFilesLabel {
        margin-top: 6px;
        padding-top: 28px;
        padding-bottom: 28px;
        font-family: verdana, arial, sans-serif;
        font-size: 12px;
        color: #2d4b6d;
        font-weight: bold;
        text-align: center;
        display: block;
        border: 2px dashed #888888;
        border-radius: 7px;
    }
    

    它没有min-height或height属性。由于填充,它实际上是可见的。我更改了样式表以使用min-height:16 px并相应地减少了顶部和底部填充,并且它在IE11中工作。 感谢此YouTube视频为IE11提供了解答https://www.youtube.com/watch?v=7M5rJ58xaLk

  3. 的解决方案