真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

重慶分公司 重慶分公司

• 網(wǎng)站建設(shè)
• 網(wǎng)站制作
• 網(wǎng)站營(yíng)銷
• 小程序
• 新聞動(dòng)態(tài)
• 成功案例
• 關(guān)于我們
028-86922220

• 網(wǎng)站建設(shè)
• 網(wǎng)站制作
• 網(wǎng)站營(yíng)銷
• 小程序
• 新聞動(dòng)態(tài)
• 成功案例
• 關(guān)于我們

css/xlstyle.css" rel="external nofollow" rel="stylesheet">



 

     
      菜譜名稱
      
       
      

還有需要配置組件的詳細(xì)js，我這里是放在了標(biāo)簽結(jié)束的后面：

以上省略

.........

 $(".myfile").fileinput({
  //上傳的地址
  uploadUrl:"<%=basePath%>food/uploadFile",
  uploadAsync : true, //默認(rèn)異步上傳
  showUpload : false, //是否顯示上傳按鈕,跟隨文本框的那個(gè)
  showRemove : false, //顯示移除按鈕,跟隨文本框的那個(gè)
  showCaption : true,//是否顯示標(biāo)題,就是那個(gè)文本框
  showPreview : true, //是否顯示預(yù)覽,不寫默認(rèn)為true
  dropZoneEnabled : false,//是否顯示拖拽區(qū)域，默認(rèn)不寫為true，但是會(huì)占用很大區(qū)域
  //minImageWidth: 50, //圖片的最小寬度
  //minImageHeight: 50,//圖片的最小高度
  //maxImageWidth: 1000,//圖片的最大寬度
  //maxImageHeight: 1000,//圖片的最大高度
  //maxFileSize: 0,//單位為kb，如果為0表示不限制文件大小
  //minFileCount: 0,
  maxFileCount : 1, //表示允許同時(shí)上傳的最大文件個(gè)數(shù)
  enctype : 'multipart/form-data',
  validateInitialCount : true,
  previewFileIcon : "",
  msgFilesTooMany : "選擇上傳的文件數(shù)量({n}) 超過(guò)允許的最大數(shù)值{m}！",
  allowedFileTypes : [ 'image' ],//配置允許文件上傳的類型
  allowedPreviewTypes : [ 'image' ],//配置所有的被預(yù)覽文件類型
  allowedPreviewMimeTypes : [ 'jpg', 'png', 'gif' ],//控制被預(yù)覽的所有mime類型
  language : 'zh'
 })
 //異步上傳返回結(jié)果處理
 $('.myfile').on('fileerror', function(event, data, msg) {
  console.log("fileerror");
  console.log(data);
 });
 //異步上傳返回結(jié)果處理
 $(".myfile").on("fileuploaded", function(event, data, previewId, index) {
  console.log("fileuploaded");
  var ref = $(this).attr("data-ref");
  $("input[name='" + ref + "']").val(data.response.url);
 });
 //同步上傳錯(cuò)誤處理
 $('.myfile').on('filebatchuploaderror', function(event, data, msg) {
  console.log("filebatchuploaderror");
  console.log(data);
 });
 //同步上傳返回結(jié)果處理
 $(".myfile").on("filebatchuploadsuccess",
   function(event, data, previewId, index) {
    console.log("filebatchuploadsuccess");
    console.log(data);
   });
 //上傳前
 $('.myfile').on('filepreupload', function(event, data, previewId, index) {
  console.log("filepreupload");
 });

配置tomcat的虛擬路徑

如題,本次圖片上傳是要上傳到服務(wù)器上別的磁盤位置，比如我的電腦作為服務(wù)器來(lái)說(shuō)，一般情況下用tomcat上傳圖片只能上傳到項(xiàng)目的某文件夾中，所以這里我們需要配置tomcat來(lái)打開tomcat的虛擬路徑，讓tomcat可以映射到本地磁盤的路徑上。操作如下圖：

1.雙擊這里

2.點(diǎn)擊我畫圈的地方

3.配置tomcat的虛擬路徑

path:也就是我們tomcat的虛擬訪問(wèn)路徑，Documnet Base是我們實(shí)際本地磁盤需要被映射的路徑。

SpringMVC的Controller層編寫

@Controller
@RequestMapping("/food")
public class PictureController {
 // uploadFile
 @RequestMapping("/uploadFile")
 @ResponseBody
 public Map uploadFile(MultipartFile myfile)
   throws IllegalStateException, IOException {
  // 原始名稱
  String oldFileName = myfile.getOriginalFilename(); // 獲取上傳文件的原名
//  System.out.println(oldFileName);
  // 存儲(chǔ)圖片的虛擬本地路徑（這里需要配置tomcat的web模塊路徑，雙擊貓進(jìn)行配置）
  String saveFilePath = "E://picture";
  // 上傳圖片
  if (myfile != null && oldFileName != null && oldFileName.length() > 0) {
   // 新的圖片名稱
   String newFileName = UUID.randomUUID() + oldFileName.substring(oldFileName.lastIndexOf("."));
   // 新圖片
   File newFile = new File(saveFilePath + "\\" + newFileName);
   // 將內(nèi)存中的數(shù)據(jù)寫入磁盤
   myfile.transferTo(newFile);
   // 將新圖片名稱返回到前端
   Map map = new HashMap();
   map.put("success", "成功啦");
   map.put("url", newFileName);
   return map;
  } else {
   Map map = new HashMap();
   map.put("error", "圖片不合法");
   return map;
  }
 }
}

寫完后直接訪問(wèn)Controller層配置的路徑，即可成功，最終效果如前面的效果圖一樣。

以上是“bootstrap中fileinput組件整合Springmvc上傳圖片到本地磁盤的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！