uploadify多文件上传插件

这个插件是兼容IE8及以上版本的，实现了基本功能，底部有下载连接

代码如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"        "http://www.w3.org/TR/html4/loose.dtd"><html><head>    <title>uploadify多文件上传插件使用</title>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">    <script type="text/javascript" src="js/jquery-1.8.2.js"></script>    <link rel="stylesheet" type="text/css" href="js/uploadfiy/uploadify.css"/>    <style type="text/css">        #fileQueue {            background_color: #FFF;            border_radius: 3px;            /* box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25); */            border:1px solid #95B8E7;            /* box-shadow: 0 1px 3px rgba(135, 175, 255, 1); */            height: 220px;            margin-bottom: 10px;            overflow: auto;            /* padding: 5px 10px; */            width: 395px;        }    </style>    <!--这个js是经过修改的，可以兼容IE8及以上的版本-->    <script type="text/javascript" src="js/uploadfiy/jquery.uploadify.js"></script>

    <script type="text/javascript">

        $(document).ready(function() {            initFile();        });

        function initFile() {

            $("#uploadify").uploadify({                'uploader': 'FileUpLoadServlet',//后台处理的页面                'swf' : './js/uploadfiy/uploadify.swf',                'script' : '',                'width':80,                'height':23,                'folder' : '../upload',                'buttonText' : '选择文件',                'fileExt' : '*.*', //允许上传的文件格式                'queueID' : 'fileQueue',                'auto' : false, //需要手动的提交申请                'simUploadLimit':3, //同时运行上传的进程数                'queueSizeLimit':10,//                'multi' : true                //'scriptData':{'dept':'dept1','group':'group1'},  //这个参数必须要设置成method为get，                //'method':'get'                           //后台用request.getParameter('name')获取名字的值            });        }

        //用户取消函数        function funCancel(event, ID, fileObj, data) {            alert('您取消了' + fileObj.name + '操作', 'info');            return;        }

        //图片上传发生的事件        function funComplete(event, ID, fileObj, response, data) {            //$("#pic").html('<img id="pic" runat="server" src=../upload/' + response + '.jpg style="width:300;height:200px;"/>');            if (response == 0) {                jBox.tip('图片' + fileObj.name + '操作失败', 'info');                return;            }            $("#pic").attr("src", "../upload/" + response).height(200).width(300);            jBox.tip('图片' + fileObj.name + '操作成功', 'info');            return;        }

        //上传发生错误时。        function funError(event, ID, fileObj, errorObj) {            jBox.tip(errorObj.info);            return;        }    </script></head>

<body style="background-color:white;">    <div id="maindiv" style="margin:0 auto;width:100%; text-align:center;border:1px solid #95b8e7; background-color:#F3F3F3;">        <div id="filecollection" style=" width:420px;margin:0 auto;text-align:left; margin-top:30px;margin-bottom:50px;">            <input type="file" name="uploadify" id="uploadify" />            <div id="fileQueue"></div>            <p style="font-size:12px;">                <a href="javascript:$('#uploadify').uploadify('upload','*')">上传</a>| <a                    href="javascript:$('#uploadify').uploadify('cancel','*')">取消上传</a>            </p>        </div>    </div></body></html>

代码下载连接：http://download.csdn.net/detail/zhzhjieke/8411193

转载于:https://www.cnblogs.com/zhzhjieke/p/4263099.html

uploadify多文件上传插件相关推荐

jquery uploadify 多文件上传插件使用经验
2019独角兽企业重金招聘Python工程师标准>>> Uploadify 官网:http://www.uploadify.com/ 一.如何使用呢? 官网原文:http://www ...
jquery文件上传插件 uploadify java_jQuery文件上传插件Uploadify使用指南
对于HTML5版本会比较好的支持手机浏览器,避免苹果手机Safari浏览器不支持 Flash,主要特性:支持多文件上传.HTML5版本可拖拽上传.实时上传进度条显示.强大的参数定制功能,如文件大小. ...
jQuery 文件上传插件：uploadify、swfupload
jQuery 文件上传插件: uploadify.swfupload
【转】jquery文件上传插件uploadify在.NET中session丢失的解决方案
2019独角兽企业重金招聘Python工程师标准>>> 基于jQuery和Flash的多文件上传插件uploadify的确很好用,具体配置和使用方法见以前的一篇文章: <一款基 ...
jquery文件上传插件|进度条
jquery文件上传插件|进度条一.Uploadify 官网:http://www.uploadify.com/ 下载地址:http://down.51cto.com/data/577863 详细参 ...
20+ 个很棒的 jQuery 文件上传插件或教程（此文值得“推荐”和“收藏”）
文件上传是网站很常见的功能之一,通过使用 jQuery 可以让上传过程更加人性化,更好的用户体验.本文介绍20个jQuery的文件上传插件,其中有一些是教程. 1. Plupload Plupload ...
基于Metronic的Bootstrap开发框架经验总结（5）--Bootstrap文件上传插件File Input的使用...
Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使用的时候,也是一步一个脚印一样摸着石头过河,这个控件在界面呈现上,叫我之前使用过的Uploadi ...
（转）基于Metronic的Bootstrap开发框架经验总结（5）--Bootstrap文件上传插件File Input的使用...
http://www.cnblogs.com/wuhuacong/p/4774396.html Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使 ...
Bootstrap文件上传插件File Input的使用
1.文件上传插件File Input介绍这个插件主页地址是:http://plugins.krajee.com/file-input,可以从这里看到很多Demo的代码展示:http://plugin ...

uploadify多文件上传插件

uploadify多文件上传插件相关推荐

最新文章

热门文章