uploadify使用以及在ie6下不兼容的问题

在ie6下不兼容的问题:对象不支持此属性或方法的问题 主要是犹豫ie6下加载swf出错,所以加上一个动态参数每次调用都会从服务器上获取最新的,这样就不会出错了



<input type="text" id="test" />


@*<div id="wrapper1">
    <p><input id="fileInput1" name="fileInput1" type="file"/></p>
    
    <div id="uploadQueue" class="uploadQueue flash"></div>
    <div id="startUpload"></div>


    <p style="margin-top:5px;font-size:14px;font-weight:bold;">
    <a href="javascript:if(checkImport()){$('#fileInput1').uploadifySettings('scriptData',{'name':$('#test').val()});$('#fileInput1').uploadifyUpload();}">导入文件</a></p>
    <p style="margin-top:5px;font-size:14px;font-weight:bold;"><span id="result"></span></p>
</div> *@


<div class="edui-dialog-wrap" id="wrapper">
    <div id="edui135_body" class="edui-dialog-body" style="width: 480px; height: 427px; ">
        <div class="edui-dialog-shadow"></div>


        <div id="" class="edui-dialog-content">
            <span id="edui135_contmask" class="dialogcontmask"></span>
            @*<iframe id="edui135_iframe" class="iframe" height="100%" width="100%" frameborder="0" src="/ueditor/dialogs/attachment/attachment.html"></iframe>*@
            <div id="wrapper1">
                <p><input id="fileInput1" name="fileInput1" type="file"/></p>
    
                <div id="uploadQueue" class="uploadQueue flash"></div>
                <div id="startUpload"></div>


                <p style="margin-top:5px;font-size:14px;font-weight:bold;">
                <a href="javascript:if(checkImport()){$('#fileInput1').uploadifySettings('scriptData',{'name':$('#test').val()});$('#fileInput1').uploadifyUpload();}">导入文件</a></p>
                <p style="margin-top:5px;font-size:14px;font-weight:bold;"><span id="result"></span></p>
            </div> 
        </div>
        <div class="edui-dialog-foot">
            <table style="width: 100%">
                <tr>
                    <td style="width: 50%"></td>
                    <td><div class="edui-button-body button_left">确认</div></td>
                    <td><div class="edui-button-body button_right">取消</div></td>
                </tr>
            </table>
        </div>
    </div>
</div>


<link href="../../UEditor/dialogs/attachment/attachment.css" rel="stylesheet" type="text/css" />


<input type="button" id="shower" value="ShowUploader" />
<script src="../../Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui.min.js" type="text/javascript"></script>
<script src="../../Scripts/Plugins/Uploadify/jquery.uploadify.v2.1.0.min.js" type="text/javascript"></script>
<script src="../../Scripts/Plugins/Uploadify/swfobject.js" type="text/javascript"></script>
<link href="../../Scripts/Plugins/Uploadify/uploadify.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/**/
    .edui-dialog-wrap 
    {
        margin-left: 0px;
margin-right: 6px;
margin-bottom: 6px;
border: 1px solid #C6C6C6;
width: 480px; 
height: 427px;
}


.footer_parent {
    position: absolute;
    right: 0px;
}


.button_left {
    position: relative;
    width: 100px;
    top: 0px;
}


.button_right {
    position: relative;
    width: 100px;
    top: 0px;
}
/*.edui-dialog-body 
{
position: relative;
background-color: white;
_zoom: 1;
    }
    


 .edui-dialog-buttons  {
background: url("/UEditor/themes/default/images/icons-all.gif") no-repeat 0 -30px;
}*/
    
.edui-button-body {
background: url("/UEditor/themes/default/images/icons-all.gif") no-repeat;
height: 24px;
width: 96px;
font-size: 12px;
line-height: 24px;
text-align: center;
cursor: default;
}  


.edui-button-body:hover {
background: url("/UEditor/themes/default/images/icons-all.gif") no-repeat 0 -30px;
height: 24px;
width: 96px;
font-size: 12px;
line-height: 24px;
text-align: center;
cursor: default;
}  
    
    
    
    
.uploadQueue
{
    border: 1px solid #AFE14C;
    padding: 10px 10px;
}
.flash 
{
    width: 420px;
    height: 236px;
    margin: 2px 5px 8px 9px;
    border-color: #D9E4FF;
    overflow-y: auto;
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -webkit-border-bottom-right-radius: 5px;
}


.edui-button-body {
    background: url("/UEditor/themes/default/images/icons-all.gif") no-repeat;
    height: 24px;
    width: 96px;
    font-size: 12px;
    line-height: 24px;
    text-align: center;
    cursor: default;
}
.ui-dialog-titlebar 
{
    cursor: pointer;
    height: 26px;
    width: 480px;
border-bottom: 1px solid 
#C6C6C6;
background: url(/UEditor/themes/default/images/dialog-title-bg.png) repeat-x bottom;
position: relative;
cursor: move;
}


.ui-dialog-titlebar-close {
border: none;
padding: 0;
margin: 0;
overflow: hidden;
}
</style>
 <script type="text/javascript">
     $(function () {
         //上传
         $('#fileInput1').uploadify({
              'uploader': '/Scripts/Plugins/Uploadify/uploadify.swf?var=' + (new Date()).getTime(),//解决ie6下对象不支持此属性或方法的问题
             'script': '/UploadifyTest/UploadFile?var=' + (new Date()).getTime(),
             'folder': '/UploadFile',
             'cancelImg': '/Scripts/Plugins/Uploadify/cancel.png',
             'fileExt': '*.xls',
             'fileDesc': '*.xls',
             'sizeLimit': 1024 * 1024 * 4, //4M
             'multi': true,
             'queueID': "uploadQueue",
             file_upload_limit: 100,  
             'onComplete': fun,
             'onSelect': function () {
                 alert("已选择文件");
             },
             'onAllComplete': allComplete,
             'onClearQueue':onClearQueue,
             custom_settings: {                                         //自定义设置,用户可在此向服务器传递自定义变量
                progressTarget: "fsUploadProgress",
                startUploadId: "startUpload"
            }
         });


     });


     function allComplete(numFilesUploaded) {
         alert(numFilesUploaded+"个文件上传成功");
     }


     function onClearQueue() {
  
     }
     function fun(event, queueID, fileObj, response, data) {
         if (response != "") {
             showInfo("成功上传" + response, true); //showInfo方法设置上传结果     
         }
         else {
             showInfo("文件上传出错!", false);
         }
     }
     //显示提示信息,textstyle2为绿色,即正确信息;textstyl1为红色,即错误信息
     function showInfo(msg, type) {
         var msgClass = type == true ? "textstyle2" : "textstyle1";
         $("#result").removeClass();
         $("#result").addClass(msgClass);
         $("#result").html(msg);
     }
     //如果点击‘导入文件’时选择文件为空,则提示
     function checkImport() {
         if ($.trim($('#uploadQueue').html()) == "") {
             alert('请先选择要导入的文件!');
             return false;
         }
         return true;
     }


     $("#shower").click(function () {
         $("#wrapper").dialog();
     });
    </script>
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Uploadify 是一款基于 jQuery 的文件上传插件,它可以方便地实现异步文件上传功能。下面是 Uploadify使用教程: 1. 下载 Uploadify 插件,并引入相关的 CSS 和 JS 文件。 2. 在 HTML 页面中添加一个文件上传的 input 元素和一个上传按钮。 ```html <input type="file" name="file_upload" id="file_upload" /> <button id="upload_btn">上传</button> ``` 3. 在 JavaScript 中初始化 Uploadify 插件。 ```js $(function() { $('#file_upload').uploadify({ 'swf': 'uploadify.swf', // 引入 SWF 文件 'uploader': 'upload.php', // 上传文件的 PHP 脚本 'fileObjName': 'file', // 上传文件的参数名 'buttonText': '选择文件', // 上传按钮的文本 'fileTypeExts': '*.jpg;*.jpeg;*.png;*.gif', // 上传文件的类型 'fileSizeLimit': '2MB', // 上传文件的大小限制 'multi': false, // 是否支持多文件上传 'onUploadSuccess': function(file, data, response) { // 上传成功后的回调函数 console.log(data); } }); $('#upload_btn').click(function() { // 点击上传按钮触发文件上传 $('#file_upload').uploadify('upload'); }); }); ``` 4. 编写上传文件的 PHP 脚本。 ```php <?php $targetDir = "uploads/"; // 上传文件的目录 $targetFile = $targetDir . basename($_FILES["file"]["name"]); // 上传文件的路径 $uploadOk = 1; $imageFileType = strtolower(pathinfo($targetFile, PATHINFO_EXTENSION)); // 上传文件的类型 // 检查文件是否已经存在 if (file_exists($targetFile)) { echo "Sorry, file already exists."; $uploadOk = 0; } // 检查文件大小 if ($_FILES["file"]["size"] > 2000000) { echo "Sorry, your file is too large."; $uploadOk = 0; } // 只允许上传图片文件 if ($imageFileType != "jpg" && $imageFileType != "jpeg" && $imageFileType != "png" && $imageFileType != "gif") { echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed."; $uploadOk = 0; } if ($uploadOk == 0) { echo "Sorry, your file was not uploaded."; } else { if (move_uploaded_file($_FILES["file"]["tmp_name"], $targetFile)) { echo "The file ". basename( $_FILES["file"]["name"]). " has been uploaded."; } else { echo "Sorry, there was an error uploading your file."; } } ?> ``` 以上就是 Uploadify 插件的使用教程,希望对你有帮助。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

码者人生

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值