引入文件
<link href="${base}css/fileinput.min.css" rel="stylesheet" />
<script src="${base}js/fileinput.min.js"></script>
<script src="${base}js/zh.js"></script>
<script src="${base}js/jquery.form.js"></script>
初始化
function initFileInput() {
$("#uploadFile").fileinput({
language: 'zh', //设置语言
showUpload: false, //是否显示上传按钮
showCaption: false,//是否显示标题
maxFileSize: 2000,
browseClass: "btn btn-primary", //按钮样式
previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
});
}
注:执行初始化方法时,先执行销毁方法
$(function(){
<span style="white-space:pre"> </span>
$("#uploadFile").fileinput('destroy');
initFileInput();
});
form中添加 enctype="multipart/form-data"
<div class="form-group" style="margin-right:20px;">
<label class="col-sm-2 control-label">上传附件</label>
<div class="col-sm-10">
<input name="uploadFile" id="uploadFile" type="file" multiple type="file">
</div>
</div>
ajax不支持文件上传,所以使用引入文件的第四个插件来提交表单
$('#add').ajaxSubmit({
url : "...",
type : "POST",
cache : false,
data : $('#add').serialize(),
success : function(data) {
if (data == "success") {
layer.alert('消息发送成功!', function() {
parent.location.reload();
window.parent.layer.closeAll('iframe');
});
}
if (data == "error") {
layer.alert('消息发送出错!')
}
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
layer.alert("出错啦!");
}
})