jquery.uploadify.3.2.1 试用在IE9,IE10中 上传文件的按钮会无法点击


以前用的是版本2.1.4,这次看见更新后就尝试了一下,发现有很多改变。

首先引入 js 和 css

  1. <link rel="stylesheet" href="uploadify.css" />  
  2.  <script src="jquery.uploadify.js"></script>  
  3. 当然jquery 是必不可少的  

接下来是代码:

    //文件上传  
    $(function() {  
        $("#uploadify").uploadify({  
           'auto' : false,  
           'method' : "post",  
           'height' : '20',  
           'width' : '100',  
           'swf' : 'uploadify.swf',   
           'uploader' : '<%=basePath%>/contract/fileUpload.action',  
           'fileTypeDesc' : '格式:txt,xls,xlsx,doc,docx',     //描述  
           'fileTypeExts' : '*.txt;*.xls;*.xlsx;*.doc;*.docx;*.zip',            //文件类型  
           'fileSizeLimit' : '10000KB',         //文件大小  
           'buttonText' : '选择文件',           //按钮名称  
           'fileObjName'    :'uploadify',  
           'successTimeout' : '5',  
           'requeueErrors' : false,  
           'removeTimeout' : '1',  
           'removeCompleted' : true,  
           'onUploadSuccess' : function(file, data, response){  
                var attach = eval('(' + data + ')');  
                $("#fileTable").show();  
                var addHtml = "<tr>"+  
                                "<td class='t_l'>"+  
                                    "<a href='<%=basePath%>/attach/downloadAttach.action?attachId="+attach.id+"'>"+attach.filename+"."+attach.fileextname+"</a>"+  
                                "</td>"+  
                                "<td class='t_r'>"+attach.filesize+"</td>"+  
                                "<td class='t_c'>"+attach.uploaddate+"</td>"+  
                                "<td class='t_c'><a href='<%=basePath%>/attach/downloadAttach.action?attachId="+attach.id+"' id='"+attach.id+"'>下载</a></td>"+  
                                "<td class='t_c'><a href='#' οnclick='removeFile(this)' id='"+attach.id+"' name='attach_id'>取消</a></td>"+  
                              "</tr>";  
                $("#fileBody").append(addHtml);  
            }  
        });  
    });  



其中 onUploadSuccess为成功上传后的回调函数 file 为上传的文件,可通过file.name 获取文件名 size 可获取大小

data 为后台reponse输出的字符串,上例中输出的是 json 对象,故使用eval 进行转换

response 为 结果 true or false,具体可参考官方文档。

    <td colspan="3">  
        <input type="file" name="uploadify" id="uploadify" />  
        <input type="button" value="上传" οnclick="$('#uploadify').uploadify('upload','*');">  
        <input type="button" value="取消" οnclick="$('#uploadify').uploadify('stop');">  
        <table style="display: none;" id="fileTable">  
            <tbody style="width: 550px;border: solid;border-color: #D0D0D3;" id="fileBody">  
                <tr style="border: solid;border: #D0D0D3;">  
                    <td width="200px;" class="t_c">文件名</td>  
                    <td width="100px;" class="t_c">大小(k)</td>  
                    <td width="150px;" class="t_c">上传时间</td>  
                    <td width="100px;" class="t_c" colspan="2">操作</td>  
                </tr>  
            </tbody>  
        </table>  
    </td>  

可以看到初始化中的很多属性都变化了,还包括上传操作的函数名称等等。


其次,还有一个问题,该控件在IE9中 上传文件的按钮会无法点击,初步查看可能是由于flash 的问题 引起,百度后发现 修改源码js 中的 classid即可。

具体可参考:

http://www.cnblogs.com/donhwa/archive/2011/06/23/ie9_swfupload_bug.html


解决此问题后的js替换文件下载

http://files.cnblogs.com/lostboy/jquery.uploadify3.1.fixed.js


http://download.csdn.net/detail/chenxiang199055/6003627



  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 9
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 9
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值