1. 程式人生 > >Ajax上傳檔案(包含檔案的型別,大小驗證)

Ajax上傳檔案(包含檔案的型別,大小驗證)

JS程式碼塊:

<script>
    //  上傳檔案
    $(function() {
        $("#button").click(function() {
                if ($("#website-title").val() == "") {
                    alert('檔名稱不能為空!\r\n')
                    return false;
                }
                if ($("#id-input-file-2").val() == "") {
                    alert('請選擇上傳的檔案!);
                    return
false; } //判斷檔案上傳型別 var fileSize = 0; //檔案型別 var filetypes = [".jpg",".png",".rar",".txt",".zip",".doc",".ppt",".xls",".pdf",".docx",".xlsx"]; var filepath = document.getElementById("id-input-file-2").value; var isnext = false
; var fileend = filepath.substring(filepath .lastIndexOf(".")); if (filetypes && filetypes.length > 0) { for (var i = 0; i < filetypes.length; i++) { if (filetypes[i] == fileend) { isnext = true
; break; } } } if (!isnext) { alert('不接受此檔案型別,請上傳zip格式的檔案!\r\n'); return false; } //判斷上傳檔案的大小 fileSize = document.getElementById("id-input-file-2").files[0].size; var size = fileSize / 1024; var filemaxsize = 1024 * 2;//2M if (size > filemaxsize) { alert('附件大小不能大於' + filemaxsize / 1024 +'M!\r\n', ); return false; } else { var form = new FormData(document .getElementById("tf")); $.ajax({ url : "${pageContext.request.contextPath}/newdeploy.action", timeout : 300000, dataType : "json", type : "post", data : form, processData : false, contentType : false, success : function(res) { if (res.code == 0) { alert("上傳成功!") } else { alert("上傳失敗!") } } }); } }) }); </script>

jsp程式碼塊:

<form id="tf">
<div>
    <input type="text" id="website-title" name="filename">
    <input type="file" id="id-input-file-2" name="file" />
    <button id="button" type="button">&nbsp;儲存</button>
</div>
</form>

相關推薦

Ajax檔案包含檔案型別大小驗證

JS程式碼塊: <script> // 上傳檔案 $(function() { $("#button").click(function() { if ($("#website-t

利用js實現無重新整理頭像檔案並顯示進度條

無重新整理上傳原理:現在我們利用新技術FormData表單資料物件可以實現快速收集表單資訊,普通表單域 和 上傳檔案域 均可以收集,再結合ajax就可以實現無重新整理上傳。 那麼怎樣顯示進度條呢?原來ajax物件有upload成員,該成員也是物件,構造器是XMLHttpR

移動端通過ajax圖片文件並在前臺展示——通過H5的FormData對象

com 地址 ces 文件 只需要 capture val data als 前些時候遇到移動端需要上傳圖片和視頻的問題,之前一直通過ajax異步的提交數據,所以在尋找通過ajax上傳文件的方法。發現了H5裏新增了一個FormData對象,通過這個對象可以直接綁定html中

FTPClient實現ftp的下載包含中文檔名和中文路徑問題

整理一個ftp上傳下載的工具類,轉編碼的問題經測試都已經很好的解決,我這裡用的ftp為Windows系統下,Linux下的ftp操作寫法不一樣,下次有用到再整理: FtpUtil jar commons-net-3.3.jar maven依賴

利用Freemarker生成doc檔案包含list迴圈ifelse判斷合併單元格嵌入表格單元格字數過多報錯等

1、利用office等軟體開啟doc文件,另存為word2003xml形式的檔案。 2、修改xml中的需要動態生成的值,Freemarker變數為${data}格式的,修改完改成ftl字尾,複製到載入

java程式碼解析excel檔案包含日期、小數的處理

package com.test.test; import java.io.IOException; import java.text.DecimalFormat; import java.text.SimpleDateFormat; import java.util.A

動態添加、刪除可限制添加條數

device child clas scale this DDM doc tex puts 1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <met

springboot 圖片多張和單張都可以

@RequestMapping("/upload") @ResponseBody public String handleFileUpload(HttpServletRequest request) { MultipartHttpServletRequest params = ((Multi

如何在github新建分支並專案可以儲存專案的不同版本

進入本地專案資料夾,並初始化 git init 新建分支並跳轉到分支 git checkout -b 分支名 新增檔案到暫存區(這裡新增專案的所有檔案) git add . 提交檔案到本地git倉庫

使用httpclient實現下載javaWeb系統資料傳輸http實現

目的:專案被拆分為兩個javaWeb專案,實現專案之間資料傳輸以及上傳、下載功能。 前臺展示專案A,後臺提供資料支援專案B 題外話: 兩個javaWeb傳輸之間使用json比較方便,如果恰好使用SpringMVC,配置相關JSON轉換工具(功能很強大非常好用),在@Con

js文件原理form表單 FormData + XHR2 + FileReader + canvas

創建 取數 dir wim text 括號 || val 常見類 目錄 form表單上傳 FormData + XHR2 + FileReader + canvas 無刷新本地預覽壓縮上傳實例 目前實現上傳的方式 瀏覽器小於等於IE9(低版本瀏覽器)使用下面的方式實現的

【JavaScript小專案】正則表示式實現使用者註冊輸入資訊驗證包含彈窗和innerHTML驗證

本博主要是運用正則表示式,登陸介面進行出生日期選擇,用到年月日的三級聯動,第一種驗證方式用到的innerHTML的的動態驗證輸入資訊,第二種驗證方式利用陣列彈窗驗證。效果:圖1.1圖1.2圖1.3圖1.4程式碼:登入頁面的login.html的,主要是年月日三級聯動 <

416day版心右下結束css驗證

《2018年11月24日》【連續416天】 標題:版心右下結束,css驗證; 內容: <div class="jd-service"> <ul> <li><a href="#"> <i>

Ajax 檔案input file FormData

FormData物件用以將資料編譯成鍵值對,以便用XMLHttpRequest來發送資料。其主要用於傳送表單資料,但亦可用於傳送帶鍵資料(keyed data),而獨立於表單使用。 jQuery Ajax 上傳檔案 通過 Ajax 向後臺傳送檔案(包括圖片)時,其引數型別屬於物件。可以建立一個 FormD

【H5】手機瀏覽器分批次多張圖片檔案包含進度條

描述 本文所描述的上傳檔案主要是應用於手機端,PC端可以酌情改造。 應用場景: 手機瀏覽器一次上傳多張圖片或者檔案,將檔案每5個拆分為一組上傳。上傳進度條為手機端上傳至後臺所用時間不包含後臺耗時。 選擇圖片用H5的input file標籤(能否選多張看瀏覽器了),上傳功能使

ASP 使用 jQuery Ajax File Uploader外掛檔案適用於支援H5的瀏覽器

  開篇先吐個槽:自從公司策略調整以後,幾乎沒有什麼3D、AR、VR的專案讓我來做了~於是···為了避免被認為無所事事, 只好硬著頭皮開始做ASP的專案了~~好在大家用的都是C# ┐(´∀`)┌ 迴歸正題,當前接手的ASP專案是執行在微信平臺的一個上傳視訊投票的小專案,裡面

java ajax非同步檔案文件、圖片都可以

在寫專案的時候,經常用到圖片上傳啊什麼的,這兒提供一個方法,萬能,咋都能用。 ajax $(".save-head").click(function () { var formData = new FormData();

Ajax檔案及攜帶引數

HTML程式碼 <div class="form-group"> <label class="col-sm-2 control-label">檔案上傳</label> <div class="col-sm-10"

SpringMVC Ajax檔案例項

做了一個檔案上傳模組,因為傳統的form提交會有頁面重新整理,不符合我的使用要求,所以我採用Ajax提交方式,這裡說明下,我的應用程式前端為Ajax提交,後端SpringMVC接收處理。 傳統form提交檔案方式: <form id="uploadPic" action="/user/

Django 使用ajax檔案

Django 使用ajax上傳檔案 JSON json指的是JavaScript物件表示法(JavaScript Object Notaion) json是輕量級的文字資料交換格式 json獨立於語言 json具有自我描述性,更易理解 JSON 使用 JavaScript 語法來描述資料物件,但是