Jquery.Uploadify v3.2 使用经验

泄露秘密 提交于 2019-12-06 08:15:05

最近项目要用到多文件上传,HTML里没有这个功能,然后上网找到了Uploadify,一个非常不错的JQuery上传插件。然后上网找到了个uploadify-v2.1.0版的例子,写得很好,可是Uploadify v3.2版本有很多方法不一样了。只好硬着头皮去官方网看鸡肠文档,其中还发现官方网下载下来的文件,有个图片的位置放错地方了,要自己手动调一下我还在网上抄了人家的个asp.net的Demo,来跟大家分享一下。


<head>
    <title>无标题页</title>
    <link href="../js/uploadify/uploadify.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script src="../js/uploadify/jquery.uploadify.js" type="text/javascript"></script>
    <script type="text/javascript">
	$(function() {
		$('#file_upload').uploadify({
		    'fileTypeDesc' : 'Image Files',
            'fileTypeExts' : '*.gif; *.jpg; *.png',
			'swf'      : '../js/uploadify/uploadify.swf',
			'uploader' : '../js/uploadify/uploadify.ashx',
			'auto'     : false
			// Your options here
		});
	});
	</script>
</head>
<body>
    <div>
        <input type="file" name="file_upload" id="file_upload" />
        <p>
            <a href="javascript:$('#file_upload').uploadify('cancel')">Cancel First File</a>
            |<a href="javascript:$('#file_upload').uploadify('cancel', '*')">Clear the Queue</a>
            |<a href="javascript:$('#file_upload').uploadify('upload', '*')">Upload the Files</a>
        </p>
    </div>
</body>
</html>

uploadify.ashx


        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            context.Response.Charset = "utf-8";

            HttpPostedFile file = context.Request.Files["Filedata"];
            string uploadPath =
                HttpContext.Current.Server.MapPath(@context.Request["folder"]) + "\\";

            if (file != null)
            {
                if (!Directory.Exists(uploadPath))
                {
                    Directory.CreateDirectory(uploadPath);
                }
                file.SaveAs(uploadPath + file.FileName);
                //下面这句代码缺少的话,上传成功后上传队列的显示不会自动消失
                context.Response.Write("1");
            }
            else
            {
                context.Response.Write("0");
            }  

        }

本人太懒了,以上代码纯属Copy

代码写好了,可是发现这里的 X 按钮出不来。原来是uploadify-cancel.png图片路径问题。下面是我的解决方案。

uploadify.css

新建了img文件夹,把uploadify-cancel.png移到img文件夹里。


以上东西就分享完毕了,可以IE9里不行(IE10还没测) 有木有大侠指点指点一下
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!