[JQUERY] 어떻게 jQuery를 함께 파일 입력 크기를 확인하려면?
JQUERY어떻게 jQuery를 함께 파일 입력 크기를 확인하려면?
해결법
-
1.당신은 실제로는 HTML5 파일 API 스펙에, 그러나, (예를 들어, 읽기 및 로컬 파일 작성을위한) 파일 시스템에 액세스 할 수없는, 거기에 일부 파일 속성은에 액세스 할 수 있는지, 그리고 파일 크기는 그들 중 하나입니다.
당신은 실제로는 HTML5 파일 API 스펙에, 그러나, (예를 들어, 읽기 및 로컬 파일 작성을위한) 파일 시스템에 액세스 할 수없는, 거기에 일부 파일 속성은에 액세스 할 수 있는지, 그리고 파일 크기는 그들 중 하나입니다.
아래의 HTML에 대한
<input type="file" id="myFile" />
다음을 시도하십시오
//binds to onchange event of your input field $('#myFile').bind('change', function() { //this.files[0].size gets the size of your file. alert(this.files[0].size); });
는 HTML5 사양의 일부이기 때문에, 그것은 최신 브라우저 (IE에 필요한 V10) 만 일이 내가 당신이 알아야 할 다른 파일에 대한 정보를 여기에 자세한 내용과 링크를 추가합니다 : http://felipe.sabino.me/javascript / 2012 / 01 / 30 / javascipt 검사 - 더 - 파일 사이즈 /
오래된 브라우저 지원
그래서 this.files에 액세스 이전 this.files 전화에 대한 오래된 브라우저에 null 값을 반환된다는 점에 유의해야합니다 [0] 예외가 발생하고 당신이 그것을 사용하기 전에 파일 API 지원을 위해 확인해야
-
2.이 방법을 만들어 당신이 할 수있는 jQuery의 유효성 검사를 사용하려면 :
이 방법을 만들어 당신이 할 수있는 jQuery의 유효성 검사를 사용하려면 :
$.validator.addMethod('filesize', function(value, element, param) { // param = size (en bytes) // element = element to validate (<input>) // value = value of the element (file name) return this.optional(element) || (element.files[0].size <= param) });
당신은 그것을 사용합니다 :
$('#formid').validate({ rules: { inputimage: { required: true, accept: "png|jpe?g|gif", filesize: 1048576 }}, messages: { inputimage: "File must be JPG, GIF or PNG, less than 1MB" } });
-
3.이 코드 :
이 코드 :
$("#yourFileInput")[0].files[0].size;
양식 입력의 파일 사이즈를 돌려줍니다.
FF 3.6 이상이 코드가 있어야한다 :
$("#yourFileInput")[0].files[0].fileSize;
-
4.나는 ASP.NET는 FileUpload 제어에 사용도 내 솔루션을 게시하고있다. 아마도 누군가는 유용하게 찾을 수 있습니다.
나는 ASP.NET는 FileUpload 제어에 사용도 내 솔루션을 게시하고있다. 아마도 누군가는 유용하게 찾을 수 있습니다.
$(function () { $('<%= fileUploadCV.ClientID %>').change(function () { //because this is single file upload I use only first index var f = this.files[0] //here I CHECK if the FILE SIZE is bigger than 8 MB (numbers below are in bytes) if (f.size > 8388608 || f.fileSize > 8388608) { //show an alert to the user alert("Allowed file size exceeded. (Max. 8 MB)") //reset file upload control this.value = null; } }) });
-
5.아래의 사용, 파일의 크기를 확인하고 그것의 더 큰 경우 취소
아래의 사용, 파일의 크기를 확인하고 그것의 더 큰 경우 취소
$("input[type='file']").on("change", function () { if(this.files[0].size > 2000000) { alert("Please upload file less than 2MB. Thanks!!"); $(this).val(''); } });
-
6.당신은 자바 스크립트를 플래시 나 실버 라이트와 함께 확인하지만 이런 종류의 작업을 수행 할 수 있습니다. 자바 스크립트 샌드 박스는 파일 시스템에 대한 액세스를 허용하지 않습니다. 크기 검사가 업로드 한 후 완료 서버 측 될 필요가있다.
당신은 자바 스크립트를 플래시 나 실버 라이트와 함께 확인하지만 이런 종류의 작업을 수행 할 수 있습니다. 자바 스크립트 샌드 박스는 파일 시스템에 대한 액세스를 허용하지 않습니다. 크기 검사가 업로드 한 후 완료 서버 측 될 필요가있다.
당신이 실버 라이트 / 플래시 경로를 이동하려는 경우, 당신은 확인할 수 있습니다 그들이 정상 대조군을 사용하는 일반 파일 업로드 핸들러에 기본적으로 설치되어 있지 않은 경우 그. (가) 실버이있는 경우이 방법 / 플래시는 자신의 경험을 좀 더 부자가 될 것입니다 설치.
-
7.
<form id="uploadForm" class="disp-inline" role="form" action="" method="post" enctype="multipart/form-data"> <input type="file" name="file" id="file"> </form> <button onclick="checkSize();"></button> <script> function checkSize(){ var size = $('#uploadForm')["0"].firstChild.files["0"].size; console.log(size); } </script>
난 당신이 표준 아약스 / HTML5의 방법을 통해 제출 양식에 계획하지 않으면이 가장 쉬운 것으로 확인하지만, 물론 그것은 아무것도 작동합니다.
메모:
var size = $('#uploadForm')["0"]["0"].files["0"].size;
이 작업에 사용하지만, 난 그냥 위의 코드를 테스트, 더 이상 크롬으로하지 않습니다 그것은 FF와 크롬 (최신) 모두에서 일했다. 제 [ "0"이제 firstChild이다.
-
8.이것을 시도하십시오 :
이것을 시도하십시오 :
var sizeInKB = input.files[0].size/1024; //Normally files are in bytes but for KB divide by 1024 and so on var sizeLimit= 30; if (sizeInKB >= sizeLimit) { alert("Max file size 30KB"); return false; }
from https://stackoverflow.com/questions/1601455/how-to-check-file-input-size-with-jquery by cc-by-sa and MIT license
'JQUERY' 카테고리의 다른 글
[JQUERY] 그것은 "스타일 변화"이벤트를 수신 할 수 있습니까? (0) | 2020.10.01 |
---|---|
[JQUERY] 캐치 페이스트 입력 (0) | 2020.09.30 |
[JQUERY] jQuery를의 형태의 방지를 두 번 제출 (0) | 2020.09.30 |
[JQUERY] 의 jQuery 유효성을 어떻게 정규 표현식 검증에 대한 규칙을 추가하려면? (0) | 2020.09.30 |
[JQUERY] $의 양식 내부가 제대로 게시하지 .load (0) | 2020.09.30 |