plupload 的使用

第一步 引入库文件


<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/js/plupload/jquery.plupload.queue/css/jquery.plupload.queue.css">
<script type="text/javascript" src="<%=request.getContextPath()%>/js/plupload/plupload.full.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/plupload/jquery.plupload.queue/jquery.plupload.queue.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/plupload/plupload.browserplus.js"></script>
<!-- 国际化中文支持 -->
<script type="text/javascript" src="<%=request.getContextPath()%>/js/plupload/i18n/zh_CN.js"></script>


第二步 标签

<div style="width:500px; margin:left; position:relative;">
<div id="uploader_statementPic">
<p>您的浏览器未安装 Flash, Silverlight, Gears, BrowserPlus 或者支持 HTML5 .</p>

</div>
<input value="重新上传" id="Reload_statementPic" type="button">
</div>


第三步 上传并返回值


$(function(){
function plupload(name){
$("#"+name).val(null);
$("#uploader_"+name).pluploadQueue({
// General settings
url : '/service/pluploadImage.do',
runtimes : 'html5,gears,browserplus,silverlight,flash,html4',
max_file_size : '40mb',
unique_names: true,
chunk_size: '20mb',
// responseType: 'json',
// Specify what files to browse for
filters : [
{title: "Image files", extensions: "*"},
{title: "Zip files", extensions: "zip"}
],
resize: {width: 640, height: 480, quality: 90},
// Flash settings
flash_swf_url: '/js/plupload/plupload.flash.swf',
// Silverlight settings
silverlight_xap_url: '/js/plupload/plupload.silverlight.xap',
// multipart_params: {"file":file.id} ,
preinit : {
Init: function(up, info) { },
UploadFile: function(up, file) { },
FileUploaded: function(up, file, info) {
}
},
init : {
FileUploaded :function(up, file, res){//这个地方用于 返回已经上传的文件值 前提是后台一定要返回哦
retObject = eval("(" + res.response + ")");
var atta = retObject.message;
if($("#"+name).val()== null || $("#"+name).val()==''){
$("#"+name+"").val(atta);
}else{
$("#"+name).val($("#"+name).val()+","+atta);
}
}
}
});
}
plupload('idCardPic');
plupload('statementPic');
plupload('bankCardPic');
$('#Reload_idCardPic').click(function(){
$("#idCardPic").val(null);
plupload("idCardPic");
});
$('#Reload_statementPic').click(function(){
$("#statementPic").val(null);
plupload("statementPic");
});
$('#Reload_bankCardPic').click(function(){
$("#bankCardPic").val(null);
plupload("bankCardPic");
});
});
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

annan211

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

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

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

打赏作者

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

抵扣说明:

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

余额充值