BootStrap fileinput.js文件上传组件实例代码

1.首先我们下载好文件输入插件引入插件

span style=' font-size :14 px'链接类型='text/css' rel='样式表href='文件输入/CSS/文件输入。CSS ' rel='外部无跟随'/脚本类型=' text/JavaScript ' src=' http :文件输入/js/文件输入。js /脚本类型=' text/JavaScript ' src=' http :文件输入/js/file input _ locale _ zh。js /脚本/span 2.html设置：

span style=' font-size :14 px'表单enctype=“多部分/表单数据”输入id=' file-file ' class=' file ' type=' file ' multiple/form/span 3 .初始化设置：

函数initFileInput(ctrlName，uploadUrl){ var control=$(' # ' ctrl name)；控制。文件输入({ resize image : true，maxImageWidth : 200，maxImageHeight : 200，resizePreference : 'width '，language : 'zh '，//设置语言uploadUrl : uploadUrl，uploadAsync : true，allowedfilextensions :[' jpg '，' png '，' gif' ]，//接收的文件后缀showUpload : true，//是否显示上传按钮showCaption : true，//是否显示标题浏览CLaSS : ' BTN BTN-小学'，//按钮样式previewpileicon : ' I class=' glyphicon glyphicon-king '/I '，maxFileCount : 3，msgFilesTooMany : '选择图片超过了最大数量，maxFileSize : 2000，})；};//初始化控件initFileInput(id，uploadurl)控件id，与上传路径initFileInput('file-file '，'/tqyh/pushMessAction ')；注：要想使用控件自带的上传按钮，以及上传进度，必须用形式包裹（当然也可以在初始化的时加入enctype: '多部分/表单数据，是一样的)但不用定义行为

强形式enctype='多部分/形式-数据'输入id=' file-file ' class=' file ' type=' file ' multiple/form/strong最后通过后台进行正常的上传就好了。

有些朋友说我没写明白，好吧我把后台代码贴出：

servlet:

@覆盖公共void doPost(HttpServletrequest请求，HttpServletResponse响应)引发ServletException，Java。io。ioexception {字符串路径=请求。GetSession().getServletContext().getRealPath('/head upload ')；UploadMediaService上传=新建UploadMediaService()；字符串头图像=上传。getmeianame(路径，请求);request.getSession().setAttribute('headname '，head image)；System.out.println('文件上传成功');} @覆盖公共void doGet(httpersvletrequest请求，HttpServletResponse响应)抛出ServletException，java.io.IOException { doPost(请求，响应);} 其实后台不用可以接收，我们通过解析请求就能获取一个或者多个上传的文件。上面代码主要核心代码：

span style=' font-size :14 px；'字符串路径=request.getSession()。getServletContext()。getRealPath('/head upload ')；UploadMediaService上传=新建UploadMediaService()；string head image=upload . getmeianame(路径，请求)；/span span style=' font-size :14 px；'Uploadmediaservice:/* * *上传媒体文件。* * @服务器上存储的param路径，以获取文件需要上传到的路径* @ param request client request * @ return */public static string upload local media(字符串路径，http servlet request){ string filename=' '；//获取磁盘文件条目工厂diskfileitemfactory=new diskfileitemfactory()；//如果不设置下面两行，上传大文件会占用大量内存。//设置一个临时储藏室，可以和文件最终存放的目录不同。/* * *原理是先存放在暂存间，再写入对应目录的硬盘。*从逻辑上讲，上传一个文件时，实际上传了两个副本。第一个在。tem格式*然后实际写入对应目录*/factory.setrepository的硬盘(新文件(路径))；//设置缓存的大小。当上传文件容量超过缓存时，将直接放入临时存储室factory . setsizehold(1024 * 1024)；//高级API文件上传处理servlet文件上传上传=新建servlet文件上传(工厂)；尝试{//可以上传多个文件listfileitem list=upload . parse request(request)；for(file item : list){//如果获取的表单信息是普通文本信息if(item.isFormField()) {//获取用户输入的字符串，名字挺好的，因为提交的表单是string值=item . getstring()；} else{ //处理传入的非简单字符串，如二进制图片和视频。/* * *以下三个步骤，主要是获取上传文件的名称*///获取路径名String值=item . getname()；//索引到最后一个反斜杠int start=value . last indexof(' \ \ ')；//截取上传文件的字符串名称，加1去掉反斜杠，filename=value。子字符串(start 1)；system . out . println(' filename=' filename ')；//将其写入磁盘//捕获它抛出的异常//item.write(新文件(路径，文件名))；//outputstreamout=由第三方手动编写的//提供的新文件outputstream(新文件(路径，文件名))；InputStream in=item . getinputstream()；int长度=0；byte [] buf=新字节[1024]；//in.read(buf)每次读取的数据都存储在buf数组中，而((length=in.read(buf))！=-1) {//从buf数组中取出数据，写入(输出流)磁盘上的out.write(buf，0，length)；} in . close()；out . close()；}}} catch(文件上传异常e) {log.error('文件上传异常：'，e)；} catch (ExceptIOn e) {log.error('文件处理io exception:'，e)；}返回文件名；} /span以上是边肖介绍的BootStrap fileinput.js文件上传组件的示例代码，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！