1、引入所需jar包
2、配置路由
3、controller
/**
*
* @Title: uploads
* Description:上传图片
* void
* @throws
*/
public void uploads() {
PropKit.use("a_little_config.txt");
//carUrl:服务器地址 localCarUrl:本地地址
String url = PropKit.get("carUrl");
// 上传代码
UploadFile uf = getFile("Filedata", "uploads");
//获得到了端口
String fileName = url + "/upload/uploads/" + uf.getFileName();
setAttr("fileName", fileName);
renderJson();
}
4、html页面
<div class="form-group">
<label class="col-sm-3 control-label no-padding-right"
for="form-field-1"> <font color="red">*</font>头像
</label>
<div class="col-sm-5">
<div style="width:120px;height:120px;margin-bottom:20px;border:1px solid #eee;">
<img id="url" src="${contextPath}/resources/admin/images/touxiang.jpg" width="120px" height="120px"/>
</div>
<input id="file_upload" name="file_upload" type="file"
multiple="true"/>
<!-- 手动上传 -->
<!-- <a href="javascript:$('#file_upload').uploadify('upload','*')"
id="uploadButton"></a> -->
</div>
</div>
4、js
<script src="${contextPath}/uploadify/jquery.uploadify.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('#file_upload')
.uploadify(
{
//校验数据
'swf' : '${contextPath}/uploadify/uploadify.swf', //指定上传控件的主体文件,默认‘uploader.swf’
'uploader' : '${contextPath}/admin/admin/uploads', //指定服务器端上传处理文件,默认‘upload.php’
'auto' : true, //手动上传
'buttonImage' : '', //浏览按钮背景图片
'multi' : false, //单文件上传
'fileTypeExts' : '*.gif; *.jpg; *.png;', //允许上传的文件后缀 *.flv;*.avi;*.mp4;*.mp3
'fileSizeLimit' : '5MB', //上传文件的大小限制,单位为B, KB, MB, 或 GB
'successTimeout' : 30, //成功等待时间
'onUploadStart':function(){
//
},
'onUploadSuccess' : function(file, data, response) {//每成功完成一次文件上传时触发一次
var image = eval("[" + data + ']')[0];
$('#url').attr('src',image.fileName);
//var image=eval(data);
//alert(image[0]["big"]);
},
'onUploadError' : function(file, data, response) {//当上传返回错误时触发
$('#url').append(data);
}
});
});
</script>
5、结构