1.做了一天终于做出来了，在上传成功之后，可以将路径添加到数据库，因为一直在烦恼如何在上传成功之后在将路径添加到数据库，终于弄出来了，太开心了，不得不说bootstrap的强大，之前说ajax不能上传文件，之后想办法，用js写，更改了上传文件按钮的样式，但是没想到bootstrap真的太厉害了，样式还不错，可以预览，图片，限制文件的大小，格式等等，还有进度条。
记得:在验证的时候，尽量用控制台来验证,有的时候你的代码写对了，但是有可能alert不显示
1.导入相应的js和样式
nofollow" rel="stylesheet">
2.模态框里加入，千万要记住name的属性和你后台的代码属性有关，还有class需要是file
有些时候试试才知道，可不可以
上传文件
Initfileinput = function (uploadurl){
$("#aaa").fileinput({
//uploadUrl: "../fileinfo/save",// server upload action
uploadUrl:"https://localhost:8080/GD/UploadAction_execute.action",required: true,showBrowse: true,browSEOnZoneClick: true,dropZoneEnabled: false,allowedFileExtensions: ["jpg","xlsx"],//只能选择xls,和xlsx格式的文件提交
//maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
layoutTemplates:{ actionUpload:''},/*上传成功之后运行*/
fileuploaded:$("#aaa").on("fileuploaded",function (event,data,previewId,index) {
console.log("Upload success");
var a = document.getElementById('aaa').value;
console.log(a);
$.ajax({
type:"post",async:false,url:"https://localhost:8080/GD/UploadAction_add.action",data:{
"filepath.path" : a
},dataType:"json",success:function () {
console.log("添加成功");
}
})
}),/*上传出错误处理*/
fileerror:$('#aaa').on('fileerror',function(event,msg) {
console.log("Upload Failed")
}),});
}
Initfileinput (); //记得加载，初始化
总结
以上所述是小编给大家介绍的BootStrap实现文件上传并带有进度条效果。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。
原文链接：https://www.f2er.com/bootstrap/36505.html