溫馨提示

創(chuàng)新互聯(lián)是一家集網(wǎng)站建設(shè),茫崖企業(yè)網(wǎng)站建設(shè),茫崖品牌網(wǎng)站建設(shè),網(wǎng)站定制,茫崖網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,茫崖網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競爭力?？沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶成長自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

Spring Boot會員管理系統(tǒng)的中，需要涉及到Spring框架，SpringMVC框架，Hibernate框架，thymeleaf模板引擎。所以，可以學(xué)習(xí)下這些知識。當(dāng)然，直接入門的話使用是沒問題，但是，涉及到一些異常和原理的話可能就有些困難。

1. 前端部分

在前端部分addMember.html是通過form表單來提交會員的信息，其中就包括了圖片上傳功能（這里涉及了文件上傳操作），表單部分代碼如下：

<form th:action="@{/admin/addMember}" method="post" enctype="multipart/form-data" id="addMember">
              <div class="file-field input-field">
                <div class="btn">
                  <span>選擇頭像文件</span>
                  <input id="file" type="file" name="iconPath" multiple="" placeholder="選擇文件" accept="image/*" onchange="changeToop()">
                </div>
                <div class="file-path-wrapper">
                  <!--<input class="file-path validate" type="text" placeholder="Upload one or more files">-->
                  <img id="myimg" src="assets/iconPath/common.jpg" class="img-responsive img-thumbnail"  />
                </div>
                <!--頭像文件上傳預(yù)覽-->
                <script>
                  function Id(id){
                    return document.getElementById(id);
                  }
                  function changeToop(){
                    var file = Id("file");
                    if(file.value===''){
                      //設(shè)置默認(rèn)圖片
                      Id("myimg").src='assets/iconPath/common.jpg';
                    }else{
                      preImg("file","myimg");
                    }
                  }
                  //獲取input[file]圖片的url Important
                  function getFileUrl(fileId) {
                    var url;
                    var file = Id(fileId);
                    var agent = navigator.userAgent;
                    if (agent.indexOf("MSIE")>=1) {
                      url = file.value;
                    } else if(agent.indexOf("Firefox")>0) {
                      url = window.URL.createObjectURL(file.files.item(0));
                    } else if(agent.indexOf("Chrome")>0) {
                      url = window.URL.createObjectURL(file.files.item(0));
                    }
                    return url;
                  }
                  //讀取圖片后預(yù)覽
                  function preImg(fileId,imgId) {
                    var imgPre =Id(imgId);
                    imgPre.src = getFileUrl(fileId);
                  }
                </script>
              </div>
              
              .......
              
            </form>

本文名稱：SpringBoot會員管理系統(tǒng)之處理文件上傳功能-創(chuàng)新互聯(lián)
本文來源：http://m.newbst.com/article30/dcgspo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁設(shè)計(jì)公司、自適應(yīng)網(wǎng)站、關(guān)鍵詞優(yōu)化、網(wǎng)站設(shè)計(jì)公司、外貿(mào)網(wǎng)站建設(shè)、軟件開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)