① Bootstrap-fileinput上传控件 前端js怎么获取服务器端执行后的返回值，求解
$("#file1").on("fileuploaded", function (event, data, previewId, index) { va url = data.response.Result; });
② bootstrap-fileinput组件怎么在上传时指定额外的URL参数
由于英文水平问题，阅读官方文档时没有找到该问题的解决方法，于是去github提了一个issue ，得到的答案是仔细阅读文档，里面有一个回调函数可以解决问题??解决方法关键的配置参数是uploadExtraData具体的代码如下：//获得额外参数的方法fodderType = function() {return $("#fodderTypeSelect").val();};//初始化fileinput控件（第一次初始化）function initFileInput(ctrlName, FileExtensions, fileSize) {var control = $('#' + ctrlName);control.fileinput({language: 'zh', //设置语言uploadUrl: "/WxMedia/ImageUpload", //上传的地址allowedFileExtensions: FileExtensions, //接收的文件后缀showUpload: true, //是否显示上传按钮showCaption: true, //是否显示标题,maxFileSize: fileSize * 1000, //单位为kb，如果为0表示不限制文件大小browseClass: "btn btn-primary", //按钮样式previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",initialCaption: "请选择上传素材",uploadExtraData: function(previewId, index) { //额外参数的关键点var obj = {};obj.fodder = fodderType();console.log(obj);return obj;}});}关键点：可以看到配置文件中uploadExtraData的参数是一个函数形式，这是一个回调函数，会在上传时调用，读取配置的额外参数。
③ bootstrap-fileupload 怎么多文件上传
最近因为项目需要研究了下bootstrap fileinput的使用，来记录下这几天的使用心得吧。 前台html页面的代码 参数2 参数3 参数4 js进行插件的初始化和一些参数的设置 $("#excelFile").fileinput({ uploadUrl:"rest/import/importExcel",//上传的地…
④ bootstrap FileInput图片上传如何在java中获取图片的名字，大小，以及如何存储在制定文件夹中
后台获取到文件了么File.getName就是文件名了
这个方法就是保存文件用的了 调用saveFile(file.getInputStrean,file.getName);
privatevoidsaveFile(InputStreaminputStream,StringfileName){OutputStreamos=null;try{Stringpath="D:\testFile\";//2、保存到临时文件//1K的数据缓冲byte[]bs=newbyte[1024];//读取到的数据长度intlen;//输出的文件流保存到本地文件FiletempFile=newFile(path);if(!tempFile.exists()){tempFile.mkdirs();}os=newFileOutputStream(tempFile.getPath()+File.separator+fileName);//开始读取while((len=inputStream.read(bs))!=-1){os.write(bs,0,len);}}catch(IOExceptione){e.printStackTrace();}catch(Exceptione){e.printStackTrace();}finally{//完毕，关闭所有链接try{os.close();inputStream.close();}catch(IOExceptione){e.printStackTrace();}}}
⑤ 请问你有Thinkphp下使用Bootstrap File Input多文件上传的案例吗
没有做这种项目，给你发一个地址你看看有没有帮助，Q上
⑥ 解决BootStrap Fileinput手机图片上传显示旋转问题
最近因为项目需要用到了bootstrapfileinput的插件，在使用苹果手机上传图片预览时，发现图片方向和手机本地存储方向不一致问题。后来通过查询资料了解图片具有EXIF(ExchangeableImageFileFormat)旋转属性标识，fileinput对旋转进行了处理。预览图片显示的为电脑图片存放方向。用iPhone手机通过home键朝向四个不同的方向进行拍照后，上传照片显示与预览图片方向并不一致。有点不明白其中缘由，后来发现了规则，只有Home键朝下和朝上的时候才会发现显示不一致问题。解决方案如下：fileinput.css、fileinput.min.css文件中，css样式旋转角度存在问题，修改以下样式就可以啦。Home键朝下拍摄.rotate-6{/*transform:rotate(90deg);原代码*/transform:rotate(270deg);}Home键朝上拍摄.rotate-8{/*transform:rotate(270deg);原代码*/transform:rotate(90deg);}以上所述是小编给大家介绍的BootStrapFileinput手机图片上传显示旋转问题，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
⑦ bootstrap fileinput 上传失败，求助
最近因为项目需要研究了下bootstrap fileinput的使用，来记录下这几天的使用心得吧。前台html页面的代码<form role="form" id="importFile" method="post"enctype="multipart/form-data"><div class="row"><div class="col-md-3" ></div><div class="col-md-3 "><input type="radio" name="excelType" class="radio" id="line" value="line"><label for="line"> 参数2</label></div><div class="col-md-3 "><input type="radio" name="excelType" class="radio" id="pipeline" value="pipeline"><label for="pipeline"> 参数3</label></div><div class="col-md-3 "><input type="radio" name="excelType" class="radio" id="jdj" value="jdj"><label for="jdj"> 参数4</label></div></div><input id="excelFile" name="excelFile" class="file-loading"type="file" multiple accept=".xls,.xlsx" data-min-file-count="1"data-show-preview="true"> <br></form>js进行插件的初始化和一些参数的设置$("#excelFile").fileinput({uploadUrl:"rest/import/importExcel",//上传的地址uploadAsync: true,language : "zh",//设置语言showCaption: true,//是否显示标题showUpload: true, //是否显示上传按钮browseClass: "btn btn-primary", //按钮样式allowedFileExtensions: ["xls", "xlsx"], //接收的文件后缀maxFileCount: 10,//最大上传文件数限制uploadAsync: true,previewFileIcon: '<i class="glyphicon glyphicon-file"></i>',allowedPreviewTypes: null,previewFileIconSettings: {'docx': '<i class="glyphicon glyphicon-file"></i>','xlsx': '<i class="glyphicon glyphicon-file"></i>','pptx': '<i class="glyphicon glyphicon-file"></i>','jpg': '<i class="glyphicon glyphicon-picture"></i>','pdf': '<i class="glyphicon glyphicon-file"></i>','zip': '<i class="glyphicon glyphicon-file"></i>',},uploadExtraData: function() {var extraValue = null;var radios = document.getElementsByName('excelType');for(var i=0;i<radios.length;i++){if(radios[i].checked){extraValue = radios[i].value;}}return {"excelType": extraValue};}});注意： uploadExtraData函数中只能用原生JS来取值，不能用JQuery来获取值，此参数用来向后台传递附加参数，以方便处理，最简单的写法是：uploadExtraData: {"excelType": document.getElementByID('id')}<input type="radio" name="excelType" class="radio网络搜索引擎营销sem竞价培训班http://www.yingtaow.com/pxfw?id="station" value="station"><label for="station"> 参数1</label>文件上传成功后的回调方法$("#excelFile").on("fileuploaded", function(event, data, previewId, index) {alert("上传成功!");$("#excelImport").modal("hide");//后台处理后返回的经纬度坐标json数组，var array = data.response;console.dir(array);//jquery循环取经纬度坐标$.each(array,function(index,latAndLon){var lon = latAndLon.lon;var lat = latAndLon.lat;var point = new Point(lon, lat, map.spatialReference);var symbol = new esri.symbol.SimpleMarkerSymbol().setStyle(SimpleMarkerSymbol.STYLE_CIRCLE).setColor(new Color([255,255,0,0.5]));var attr = {"address": "addressName" };var infoTemplate = new esri.InfoTemplate("标题", "地址 :${address}");var graphic = new Graphic(point,symbol,attr,infoTemplate);map.graphics.add(graphic);});});arcgis中点的定义的两种方法：var point = new Point(lon, lat, new SpatialReference({ wkid: 4326 }));var point = new Point(lon, lat, map.spatialReference);后台Java处理，使用common fileupload插件来实现，此处限制只能上传excel 文件public JSONArray importExcel(HttpServletRequest request,HttpServletResponse response) throws Exception {final String allowFileSuffix = "xls,xlsx";Subject subject = SecurityUtils.getSubject();String uname = (String) subject.getPrincipal();String basePath = "D:" + File.separator + uname;File tmpDir = new File(basePath);// 初始化上传文件的临时存放目录JSONArray jsonArry = new JSONArray();if (!tmpDir.exists()) {tmpDir.mkdirs();}// 检查输入请求是否为multipart表单数据。if (ServletFileUpload.isMultipartContent(request)) {DiskFileItemFactory dff = new DiskFileItemFactory();// 创建该对象dff.setRepository(tmpDir);// 指定上传文件的临时目录dff.setSizeThreshold(1024000);// 指定在内存中缓存数据大小,单位为byteServletFileUpload sfu = new ServletFileUpload(dff);// 创建该对象// sfu.setFileSizeMax(5000000);//指定单个上传文件的最大尺寸sfu.setSizeMax(10000000);// 指定一次上传多个文件的总尺寸sfu.setHeaderEncoding("utf-8");String type = null;List<FileItem> fileItems = new ArrayList<FileItem>();try {fileItems = sfu.parseRequest(request);} catch (FileUploadException e1) {System.out.println("文件上传发生错误" + e1.getMessage());}String fullPath = null;String fileName = null;for (FileItem fileItem : fileItems) {// 判断该表单项是否是普通类型if (fileItem.isFormField()) {String name = fileItem.getFieldName();// 控件名String value = fileItem.getString();if (name.equals("excelType")) {type = value;}} else {String filePath = fileItem.getName();if (filePath == null || filePath.trim().length() == 0)continue;fileName = filePath.substring(filePath.lastIndexOf(File.separator) + 1);String extName = filePath.substring(filePath.lastIndexOf(".") + 1);fullPath = basePath + File.separator + fileName;if (allowFileSuffix.indexOf(extName) != -1) {try {fileItem.write(new File(fullPath));} catch (Exception e) {e.printStackTrace();}} else {throw new FileUploadException("文件格式不正确");}}}if (type.equals("station")) {jsonArry = readExcel(fullPath, fileName);} else if (type.equals("line")) {System.out.println("===============:line");} else if (type.equals("pipeline")) {System.out.println("===============:pipeline");} else if (type.equals("jdj")) {System.out.println("===============:jdj");}}return jsonArry;}// 判断文件类型public Workbook createWorkBook(InputStream is, String excelFileName)throws IOException {if (excelFileName.toLowerCase().endsWith("xls")) {return new HSSFWorkbook(is);}if (excelFileName.toLowerCase().endsWith("xlsx")) {return new XSSFWorkbook(is);}return null;}public JSONArray readExcel(String basePath, String fileName)throws FileNotFoundException, IOException {File file = new File(basePath);Workbook book = createWorkBook(new FileInputStream(file), fileName);JSONObject jsonObj = new JSONObject();JSONArray jsonArry = new JSONArray();Sheet sheet = book.getSheetAt(0);for (int i = 3; i < sheet.getLastRowNum(); i++) {Row row = sheet.getRow(i);String lon = row.getCell(2).getNumericCellValue() + "";String lat = row.getCell(3).getNumericCellValue() + "";jsonObj.put("lat", lat);// 纬度jsonObj.put("lon", lon);// 经度jsonArry.add(jsonObj);}System.out.println(jsonArry.toString());return jsonArry;}
⑧ Bootstrap-bootstrap有没有形式简单的文件上传组件
Fine Uploader特点如下:Fine Uploader Features:A：支持文件上传进度显示.B：文件拖拽浏览器上传方式C：Ajax页面无刷新.D：多文件上传.F：跨浏览器.E：跨后台服务器端语言.在Git Hub上Fine Uploader上下载打包源码,在Php Designer 8中打开其源码可以看到其源码结构如下:2013-01-04_162943在根目录中可以看到Client客户端调用需要使用文件.Server目录则是对应不同语言Perl/Php/Asp.net[VB]等版本实现.test目录则有包含一个完整本地Sample Demo.可供参考.如何快速构建一个简单Demo? 其实官方在Basic-Demo-Page上已经给出一个简单的演示.这里基于Bootstrap方式构建.首先新建一个Html空白页面.命名FineUploderDemo.html.添加如下CSS引用如下: 1: <link href="static/css/fineuploader.css" rel="stylesheet"> 2: <link href="static/css/bootstrap.min.css" rel="stylesheet"> 这两个文件时必须引用的.fineuploader.css则是对应下载Fine Uploder源码Client目录下.fineuploder.css 提供JS脚本中所需的CSS样式，主要包括按钮的样式、进度显示的样式以及上传结果的样式.添加JavaScript文件引用如下: 1: <script src="static/script/fineupload/header.js"></script> 2: <script src="static/script/fineupload/util.js"></script> 3: <script src="static/script/fineupload/button.js"></script> 4: <script src="static/script/fineupload/handler.base.js"></script> 5: <script src="static/script/fineupload/handler.form.js"></script> 6: <script src="static/script/fineupload/handler.xhr.js"></script> 7: <script src="static/script/fineupload/uploader.basic.js"></script> 8: <script src="static/script/fineupload/dnd.js"></script> 9: <script src="static/script/fineupload/uploader.js"></script>其中uploder.js和uploder.basic.js则是前端的所有上传功能都在该脚本中实现.必须引用.同时添加client目录下processing和loading两张进度显示所需要的动态图片.该图片都在fineuploder.css文件调用.在body添加如下Code: 1: <div id="bootstrapped-fine-uploader"></div> 2: <script> 3: function createUploader() { 4: var uploader = new qq.FineUploader({ 5: element: document.getElementById('bootstrapped-fine-uploader'), 6: request: { 7: endpoint: 'server/handlerfunction' 8: }, 9: text: { 10: uploadButton: '<i class="icon-upload icon-white"></i> Click me now and upload a proct image' 11: }, 12: template: 13: '<div class="qq-uploader span12">' + 14: '<pre class="qq-upload-drop-area span12"><span>{dragZoneText}</span></pre>' + 15: '<div class="qq-upload-button btn btn-success" style="width: auto;">{uploadButtonText}</div>' + 16: '<span class="qq-drop-processing"><span>{dropProcessingText}</span>'+ 17: '<span class="qq-drop-processing-spinner"></span></span>' + 18: '<ul class="qq-upload-list" style="margin-top: 10px; text-align: center;"></ul>' + 19: '</div>', 20: classes: { 21: success: 'alert alert-success', 22: fail: 'alert alert-error' 23: }, 24: debug: true 25: }); 26: } 27: 28: window.onload = createUploader; 29: </script>这是基于Bootstrap实现对Fine Uploader最简单的前端调用.前端一般需要做两件事A:添加Css+Js文件引用.B：在Js中实例化qq.FineUploder对象.运行效果
⑨ bootststrap怎样上传文件
就fread，不用fseek char data[100]; FILE* fin=fopen(….); while(!feof(fin)){//是否到文件末尾 fread(data，100，1，fin); }
⑩ 后台如何接受bootstrap-fileinput组件怎么在上传时指定额外的值
//获得额外参数的方法fodderType = function() {return $("#fodderTypeSelect").val();};//初始化fileinput控件（第一次初始化）function initFileInput(ctrlName, FileExtensions, fileSize) {var control = $('#' + ctrlName);control.fileinput({language: 'zh', //设置语言uploadUrl: "/WxMedia/ImageUpload", //上传的地址allowedFileExtensions: FileExtensions, //接收的文件后缀showUpload: true, //是否显示上传按钮showCaption: true, //是否显示标题,maxFileSize: fileSize * 1000, //单位为kb，如果为0表示不限制文件大小browseClass: "btn btn-primary", //按钮样式previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",initialCaption: "请选择上传素材",uploadExtraData: function(previewId, index) { //额外参数的关键点var obj = {};obj.fodder = fodderType();console.log(obj);return obj;}});}关键点：可以看到配置文件中uploadExtraData的参数是一个函数形式，这是一个回调函数，会在上传时调用，读取配置的额外参数。
未经允许不得转载：山九号 » bootstrap文件上传|请问你有Thinkphp下使用Bootstrap File Input多文件上传的案例吗
