使用uploadify3.2插件（flash版）上传文件

发布时间：2020-12-15 07:17:46 所属栏目：百科来源：网络整理

导读：uploadify插件支持多文件上传、进度条，有flash版本和html5版本，这里的例子flash版本。需要提示的是，flash版本需要放在服务器访问才有效果，本地访问html文件是没效果的，我有一篇博文：js实现复制到剪切板，兼容所有浏览器，里面用的插件也有flash，也必

uploadify插件支持多文件上传、进度条，有flash版本和html5版本，这里的例子flash版本。需要提示的是，flash版本需要放在服务器访问才有效果，本地访问html文件是没效果的，我有一篇博文：js实现复制到剪切板，兼容所有浏览器，里面用的插件也有flash，也必须放在服务器才有效果（如果不是这个经验我调试uploadify的时候估计得费很多时间）。

uploadify官网：http://www.uploadify.com/，需要jquery.js的支持，uploadify的参数打开没有含有min的那个js里面就有英文解释，虽然是英文但绝不会漏信息。

<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title>上传demo</title>
<link?rel="stylesheet"?type="text/css"?href="uploadify.css">
<script?type="text/javascript"?src="jquery-1.11.3.min.js"></script>
<script?type="text/javascript"?src="jquery.uploadify.min.js"></script>
<script?type="text/javascript">
$(function()?{
	var?$fileupload?=?$('#fileupload');
	var?$uploadBtn=$('#uploadBtn');
	var?$cancelBtn=$('#cancelBtn');
	var?$clearBtn=$('#clearBtn');
	
	$fileupload.uploadify({
		'auto'?:?false,'multi'?:?true,'buttonText'?:?'选择上传文件','fileSizeLimit'?:?'10MB',//上传文件大小限制
		'formData':{'title':'这是标题','desc':'这是视频描述'}，
		'fileTypeDesc'?:?'视频文件','fileTypeExts'?:?'*.avi;?*.mp4;?*.mov',//文件类型过滤
		'swf'?:?'uploadify.swf',//uploadify.swf的链接
		'uploader'?:?'http://www.baidu.com',//上传的链接，这里肯定是失败的！
		//onUploadSuccess为上传完视频之后回调的方法
		'onUploadSuccess'?:?function(file,?data,?response)?{
			alert("成功上传一个！");
		}
	});
	
	$uploadBtn.click(function(){
		$fileupload.uploadify('upload',"*");
	});
	
	$cancelBtn.click(function(){
		$fileupload.uploadify('cancel');
	});	
	
	$clearBtn.click(function(){
		$fileupload.uploadify('cancel',"*");
	});
});
</script>

</head>
<body>
	<input?type="file"?id="fileupload"?/>
	<input?type="button"?id="uploadBtn"?value="点击上传"?/>
	<input?type="button"?id="cancelBtn"?value="取消当前上传"?/>
	<input?type="button"?id="clearBtn"?value="取消所有上传"?/>
</body>

如果不行就下载我的整个项目放进tomcat访问吧：http://git.oschina.net/jsc/UploadifyDemo

使用这个插件你可能会遇到一个问题，就是formData是请求参数，怎么自定义呢？例如我上面的例子中是写死的：

'formData':{'title':'这是标题','desc':'这是视频描述'}

你可能会弄成一个变量，但是这样是无用的！

应该这么办：

$uploadBtn.click(function(){
????$fileupload.uploadify('settings',?'formData',?"{'title':'新的标题','desc':'新的视频描述');
????$fileupload.uploadify('upload',"*");
});

这样就能设置请求参数，而且它的规则是“有则覆盖，无则新增”！也就是说如果我写成：

$fileupload.uploadify('settings',?"{'tab':'这是视频标签'}");

还会保留原来的title和desc参数。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!