복붙노트

[JQUERY] 업로드하기 전에 파일 크기를 가져옵니다

JQUERY

업로드하기 전에 파일 크기를 가져옵니다

해결법


  1. 1.는 HTML 울부 짖는 소리를 들어

    는 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);
    
    });
    

    스레드 다음을 참조하십시오 :

    어떻게 jQuery를 함께 파일 입력 크기를 확인하려면?


  2. 2.

    <script type="text/javascript">
    function AlertFilesize(){
        if(window.ActiveXObject){
            var fso = new ActiveXObject("Scripting.FileSystemObject");
            var filepath = document.getElementById('fileInput').value;
            var thefile = fso.getFile(filepath);
            var sizeinbytes = thefile.size;
        }else{
            var sizeinbytes = document.getElementById('fileInput').files[0].size;
        }
    
        var fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
        fSize = sizeinbytes; i=0;while(fSize>900){fSize/=1024;i++;}
    
        alert((Math.round(fSize*100)/100)+' '+fSExt[i]);
    }
    </script>
    
    <input id="fileInput" type="file" onchange="AlertFilesize();" />
    

    IE와 FF에 대한 작업


  3. 3.여기에 업로드하기 전에 파일의 크기를 얻기의 간단한 예입니다. 이 내용이 추가되거나 변경 될 때마다 감지하는 jQuery를 사용하고,하지만 당신은 여전히 ​​jQuery를 사용하지 않고 [0] 크기는이 파일을 얻을 수 있습니다.

    여기에 업로드하기 전에 파일의 크기를 얻기의 간단한 예입니다. 이 내용이 추가되거나 변경 될 때마다 감지하는 jQuery를 사용하고,하지만 당신은 여전히 ​​jQuery를 사용하지 않고 [0] 크기는이 파일을 얻을 수 있습니다.

    $ (문서) .ready (함수 () { $ ( '# openFile'). ( '변화', 기능 (EVT) {에 CONSOLE.LOG (this.files [0] 크기는); }); }); <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">

    <입력 ID = "openFile 'NAME ="IMG "TYPE ="파일 "/>


  4. 4.저도 같은 문제를 가지고 우리가 정확한 솔루션을 가지고하지 않은 것 같다. 이 다른 사람들을 도울 수 있기를 바랍니다.

    저도 같은 문제를 가지고 우리가 정확한 솔루션을 가지고하지 않은 것 같다. 이 다른 사람들을 도울 수 있기를 바랍니다.

    걸릴 시간은 약 탐험 후, 나는 마침내 해답을 발견했다. 이것은 jQuery를 함께 첨부 파일을 얻을 내 코드입니다 :

    var attach_id = "id_of_attachment_file";
    var size = $('#'+attach_id)[0].files[0].size;
    alert(size);
    

    이 파일 크기를 점점 단지 예제 코드입니다. 다른 물건을 원한다면, 당신의 요구를 충족하기 위해 코드를 변경 주시기 바랍니다.


  5. 5.모든 브라우저에서 작동하는 최고의 솔루션)

    모든 브라우저에서 작동하는 최고의 솔루션)

    function GetFileSize(fileid) {
        try {
            var fileSize = 0;
            // for IE
            if(checkIE()) { //we could use this $.browser.msie but since it's deprecated, we'll use this function
                // before making an object of ActiveXObject, 
                // please make sure ActiveX is enabled in your IE browser
                var objFSO = new ActiveXObject("Scripting.FileSystemObject");
                var filePath = $("#" + fileid)[0].value;
                var objFile = objFSO.getFile(filePath);
                var fileSize = objFile.size; //size in b
                fileSize = fileSize / 1048576; //size in mb 
            }
            // for FF, Safari, Opeara and Others
            else {
                fileSize = $("#" + fileid)[0].files[0].size //size in b
                fileSize = fileSize / 1048576; //size in mb 
            }
            alert("Uploaded File Size is" + fileSize + "MB");
        }
        catch (e) {
            alert("Error is :" + e);
        }
    }
    

    http://www.dotnet-tricks.com/Tutorial/jquery/HHLN180712-Get-file-size-before-upload-using-jquery.html에서

    UPDATE : 이 IE 브라우저 또는 아니라면 우리는 확인이 기능을 사용합니다

    function checkIE() {
        var ua = window.navigator.userAgent;
        var msie = ua.indexOf("MSIE ");
    
        if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)){  
            // If Internet Explorer, return version number
            alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
        } else {
            // If another browser, return 0
            alert('otherbrowser');
        }
    
        return false;
    }
    

  6. 6.$ (문서) .ready (함수 () { $ ( '# openFile'). ( '변화', 기능 (EVT) {에 CONSOLE.LOG (this.files [0] 크기는); }); }); <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> <입력 ID = "openFile 'NAME ="IMG "TYPE ="파일 "/>

    $ (문서) .ready (함수 () { $ ( '# openFile'). ( '변화', 기능 (EVT) {에 CONSOLE.LOG (this.files [0] 크기는); }); }); <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> <입력 ID = "openFile 'NAME ="IMG "TYPE ="파일 "/>


  7. 7.HTML5를 지원하는 브라우저는 입력 유형에 대한 파일 속성이 있습니다. 이 의지는 물론 오래된 IE 버전에서 작동하지.

    HTML5를 지원하는 브라우저는 입력 유형에 대한 파일 속성이 있습니다. 이 의지는 물론 오래된 IE 버전에서 작동하지.

    var inpFiles = document.getElementById('#fileID');
    for (var i = 0; i < inpFiles.files.length; ++i) {
        var size = inpFiles.files.item(i).size;
        alert("File Size : " + size);
    }
    

  8. 8.ucefkh의 솔루션은 최선을 다했다,하지만 $ .browser가 jQuery를 1.91에서 더 이상 사용되지 않았기 때문에, navigator.userAgent를 사용하도록 변경했다 :

    ucefkh의 솔루션은 최선을 다했다,하지만 $ .browser가 jQuery를 1.91에서 더 이상 사용되지 않았기 때문에, navigator.userAgent를 사용하도록 변경했다 :

    function IsFileSizeOk(fileid) {
        try {
            var fileSize = 0;
            //for IE
            if (navigator.userAgent.match(/msie/i)) {
                //before making an object of ActiveXObject, 
                //please make sure ActiveX is enabled in your IE browser
                var objFSO = new ActiveXObject("Scripting.FileSystemObject");
                var filePath = $("#" + fileid)[0].value;
                var objFile = objFSO.getFile(filePath);
                var fileSize = objFile.size; //size in b
                fileSize = fileSize / 1048576; //size in mb 
            }
            //for FF, Safari, Opeara and Others
            else {
                fileSize = $("#" + fileid)[0].files[0].size //size in b
                fileSize = fileSize / 1048576; //size in mb 
            }
            return (fileSize < 2.0);
        }
        catch (e) {
            alert("Error is :" + e);
        }
    }
    

  9. 9.당신은 파일 크기를 얻을 수 아약스 HEAD 요청을 할 필요가있다. JQuery와 함께이 같은 뭔가

    당신은 파일 크기를 얻을 수 아약스 HEAD 요청을 할 필요가있다. JQuery와 함께이 같은 뭔가

      var req = $.ajax({
        type: "HEAD",
        url: yoururl,
        success: function () {
          alert("Size is " + request.getResponseHeader("Content-Length"));
        }
      });
    

  10. 10.기회가 Internet Explorer에서 무서운 경고 메시지를 표시하고 멀리 사용자를 놀라게 것입니다으로 액티브 X를 사용하지 마십시오.

    기회가 Internet Explorer에서 무서운 경고 메시지를 표시하고 멀리 사용자를 놀라게 것입니다으로 액티브 X를 사용하지 마십시오.

    사람이 검사를 구현하고자하는 경우, 그들은 단지 최신 브라우저에서 사용할 수있는 파일 목록 객체에 의존 만 이전 버전의 브라우저 (점진적 개선)을위한 서버 측의 검사에 의존해야한다.

    function getFileSize(fileInputElement){
        if (!fileInputElement.value ||
            typeof fileInputElement.files === 'undefined' ||
            typeof fileInputElement.files[0] === 'undefined' ||
            typeof fileInputElement.files[0].size !== 'number'
        ) {
            // File size is undefined.
            return undefined;
        }
    
        return fileInputElement.files[0].size;
    }
    

  11. 11.당신은 PHP 파일 크기 기능을 사용할 수 있습니다. Ajax를 사용하여 업로드하는 동안 요청 PHP 스크립트에 대한 아약스 요청하여 먼저 파일 크기를 확인하시기 바랍니다 체크 파일 크기와 값을 반환합니다.

    당신은 PHP 파일 크기 기능을 사용할 수 있습니다. Ajax를 사용하여 업로드하는 동안 요청 PHP 스크립트에 대한 아약스 요청하여 먼저 파일 크기를 확인하시기 바랍니다 체크 파일 크기와 값을 반환합니다.


  12. 12.당신은에 의해 HTML5 파일 API를 사용 할 수 있습니다 http://www.html5rocks.com/en/tutorials/file/dndfiles/

    당신은에 의해 HTML5 파일 API를 사용 할 수 있습니다 http://www.html5rocks.com/en/tutorials/file/dndfiles/

    그러나 당신은 항상 PHP에 대한 대체 (또는 당신이 사용하는 다른 백엔드 언어) 이전 버전의 브라우저를위한이 있어야합니다.


  13. 13.개인적으로, 나는 웹 세계의 답변이 가장 좋은 오늘, 주어진 HTML 표준이다 말할 것입니다. 당신이 IE <10을 지원해야하는 경우에는 액티브 X의 어떤 형태를 사용해야합니다. 나는 Scripting.FileSystemObject와에 대해 코딩, 또는 직접 액티브 X를 인스턴스화하는 것을 포함 권장 사항을 피할 것이다.

    개인적으로, 나는 웹 세계의 답변이 가장 좋은 오늘, 주어진 HTML 표준이다 말할 것입니다. 당신이 IE <10을 지원해야하는 경우에는 액티브 X의 어떤 형태를 사용해야합니다. 나는 Scripting.FileSystemObject와에 대해 코딩, 또는 직접 액티브 X를 인스턴스화하는 것을 포함 권장 사항을 피할 것이다.

    이 경우, 나는 JS 그를 지원하지 않는 백필 브라우저에 HTML5 API를 또는 플래시 / 실버 라이트 컨트롤을 사용하도록 구성 할 수 있습니다 plupload 등 도서관 타사를 사용하여 성공을 거두었습니다. Plupload 파일 크기가 IE의 작품 <10를 확인하기위한 클라이언트 측 API가 있습니다.

  14. from https://stackoverflow.com/questions/7497404/get-file-size-before-uploading by cc-by-sa and MIT license