我想限制用戶上傳包含字母、特殊字符和空格的檔案名。
我想只允許數字 0,1,2,3,4,5,6,7,8,9 和最多 11 個數字。
示例：54874563101.png
javascript中的上傳按鈕解決方案將是完美的
有人可以幫忙嗎？謝謝
<button type="button" onclick="upload()" value="upload" id="buttonUpload">Upload</button>uj5u.com熱心網友回復：
您可以檢查檔案名長度，然后使用正則運算式確保名稱中只提供數字。
$("#file").on("change", function() {
const rawFileName = $("#file").val().split('\\').pop().split(".");
const fileName = rawFileName[0];
const fileExtension = rawFileName[1];
// Validate file extension.
if (fileExtension !== "png") {
alert("Only .png files are allowed!");
return;
}
// Validate file name.
if (fileName.length > 11) {
alert("File name must be 11 or less characters!");
return;
}
if (!(/^\d $/.test(fileName))) {
alert("Only digits are allowed in the file name!");
return;
}
// Validate file size.
const fileSize = $("#file")[0].files[0].size;
if ((fileSize < 40000) || (fileSize > 100000)) {
alert("File size must be between 40kb and 100kb!");
return;
}
// Validated.
alert("File name valid!");
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
<input type="file" id="file" accept="image/png" />
<button type="submit">Submit</button>
</form>驗證檔案名
要使用 jQuery 獲取檔案名，我們可以使用：
const fileName = $("#file").val();
然而，這將輸出一個填充相對路徑以及檔案擴展名，因此我們可以進一步分離檔案名和擴展名。
const rawFileName = $("#file").val().split('\\').pop().split(".");
const fileName = rawFileName[0];
const fileExtension = rawFileName[1];
然后我們可以匹配檔案名以確定它只包含使用正則運算式的數字/^\d $/：
^開始時的資產位置\d匹配 [0-9] 中的數字字符$資產倉位到底
驗證檔案大小
要在 jQuery 中獲取檔案的大小：
const fileSize = $("#file")[0].files[0].size;
這將回傳一個int值，其中包含上傳的第一個檔案的位元組大小。（在這種形式中，只允許上傳單個檔案，因此它存盤在 下files[0]）
if ((fileSize < 40000) || (fileSize > 100000))
40000位元組等于 40kb，位元組等于100000100kb。
檔案上傳擴展限制
為了限制檔案上傳器只接受特定的檔案擴展名，accept可以將該屬性添加到input元素中。
<input type="file" id="file" accept="image/png" />
該image/png值僅允許帶有.png擴展名的檔案，有關詳細資訊，請參閱唯一檔案型別說明符。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/361525.html
標籤：javascript 正则表达式 验证 按钮 上传
上一篇：NodeJS中的自定義阻止默認值