信乎OA，文件上传Fromdata如何兼容IE6/7/8/9浏览器！本人已经测试成功使用了

最新推荐文章于 2021-01-18 00:51:29 发布

不怀好毅

最新推荐文章于 2021-01-18 00:51:29 发布

阅读量1.4k

点赞数

本文链接：https://blog.csdn.net/hello_duyun/article/details/93047526

版权

多数浏览器都支持FormData，但是IE10以下的浏览器却显示FormData未定义

使用 FormData 的最大优点就是可以异步上传二进制文件

然而本篇文章我所演示到的，是使用Flash来兼容我们的IE6/7/8/9

这也是近期一次项目中用了比较好用的开源：信乎OA系统，此系统中上传附件的功能就是使用了FormData。

直奔主题，如何兼容IE6/7/8/9，这里笔者曾经用织梦的时候系统中自带有SWFUpload上传插件感觉挺好用的

于是研究了一下SWFUpload，SWFUpload是一个flash和js相结合而成的文件上传插件,其功能非常强大。最重要的是也是二进制上传文件。也是巧了

具体思路就是如果用户用的浏览器支持FormData，那就原有的不便，如果不支持FormData，那么前端的上传代码改一下使用SWFUpload

信乎OA使用的FormData也是二进制上传，SWFUpload使用的也是二进制上传，那么后台的处理程序，我们就不用再重写了。只需要把前台上传的方式方法写好就行了

js/js.js文件中js.upload增加了一段if(typeof(FormData)=='undefined')如果浏览器不支持FormData将使用swf的上传地址

   if(typeof(FormData)=='undefined'){
       var url = 'index.php?m=allupload&d=public&callback='+call+'&upkey='+js.uploadrand+'';
   }

allupload这个是自己添加的，需要建立对应的目录和文件，下图是用IE9测试的截图。IE6、7、8也测试了，成功

下面是tpl_allupload.html文件的代码，其实代码根据需求来修改的。

<title><?=$da['title']?></title>
<script language="javascript">
window.onload = function ()
{

           swfu = new SWFUpload(
           {
               // Backend Settings swfupload/swfupload.php
               upload_url: "index.php?a=upfile&m=allupload&d=public&maxsize=8&uptype=*&thumbnail=&ajaxbool=true&rnd=115961",
               file_post_name:"file",
               post_params: {},
               // File Upload Settings
               file_size_limit : "200 MB",   // 2MB
               file_types : "*.*",
               file_types_description : "选择要上传的文件",
               file_upload_limit : "0",

               file_queue_error_handler : fileQueueError,
               file_dialog_complete_handler : fileDialogComplete,
               upload_progress_handler : uploadProgress,
               upload_success_handler : uploadSuccess,
               upload_complete_handler : uploadComplete,
               button_disabled : false,

               //
               button_placeholder_id : "spanButtonPlaceholder",
               button_width: 86,
               button_height: 29,
               button_image_url : "swfupload/images/add.png",

               button_text_top_padding: 0,
               button_text_left_padding: 10,
               button_text_right_padding: 10,
               button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
               button_cursor: SWFUpload.CURSOR.HAND,
               moi:1,
               wcarr:[],
               // Flash Settings
               flash_url : "/swfupload/swfupload.swf",

               custom_settings : {
                   upload_target : "upfile"
               },

               // Debug Settings
               debug: false
           });

};
var up={
   okla:function(){

       var showid     = '<?=$params["showid"]?>';
       if(showid!=''){
           try{parent.js.downupshow(swfu.settings.wcarr, showid);}catch(e){}
           try{opener.js.downupshow(swfu.settings.wcarr, showid);}catch(e){}
       }
       this.closeaa();
   },
   closeaa:function(){
       window.close();
       try{parent.js.tanclose('uploadwin')}catch(e){}
   }
}

</script>
<script type="text/javascript" src="swfupload/handlers.js"></script>
<style type="text/css">
.alert{ padding:1px 5px; border:1px #996 solid; background-color:#ffffff; color:#933}
*{ font-size:14px;}
.mdiv{ border-bottom:1px #cccccc solid; height:22px; overflow:hidden}
.mdiv div{ float:left; height:22px; line-height:22px; overflow:hidden; padding:0px 3px}
.div01{ width:55%;text-align:left;border-right:1px #cccccc solid;}
.div02{ width:15%; text-align:center;border-right:1px #cccccc solid;}
.div03{ width:25%;text-align:left}
#prou{overflow:hidden; background-color:#ffffff; margin:5px 0px; border:1px #666 solid;padding:0px; text-align:left;font-size:12px; position:relative; height:18px;line-height:18px}
#prou span{ left:5px; position:absolute; top:2px}
#proudiv{ position:absolute; left:0px; top:0px; height:18px; overflow:hidden; background-color:#09F;width:0%}
button{ cursor:pointer}
#footmsg{ text-align:left; padding:3px}
.quebntha{position:fixed;right:10px;bottom:10px;}
.webbtn{color:#ffffff;opacity:0.8; background-color:#1389D3; padding:5px 8px; border:none; cursor:pointer;font-size:14px;outline:none;border-radius:5px}
.webbtn:disabled{background-color:#aaaaaa; color:#eeeeee}
.webbtn:hover{box-shadow:0px 0px 5px rgba(0,0,0,0.3);opacity:1}
</style>
</head>
<body>

</div>
<div id="footmsg"></div>

</body>
</html>

不怀好毅

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
信乎OA，文件上传Fromdata如何兼容IE6/7/8/9浏览器！本人已经测试成功使用了

多数浏览器都支持FormData，但是IE10以下的浏览器却显示FormData未定义使用 FormData 的最大优点就是可以异步上传二进制文件然而本篇文章我所演示到的，是使用Flash来兼容我们的IE6/7/8/9这也是近期一次项目中用了比较好用的开源：信乎OA系统，此系统中上传附件的功能就是使用了FormData。直奔主题，如何兼容IE6/7/8/9，这里笔者曾经用织梦的时...
复制链接

扫一扫