code

입력 유형 = "파일"대화 상자를 특정 파일 유형별로 필터링하는 방법은 무엇입니까?

codestyles 2020. 11. 4. 08:01
반응형

입력 유형 = "파일"대화 상자를 특정 파일 유형별로 필터링하는 방법은 무엇입니까?


.NET Framework의 찾아보기 버튼을 클릭 할 때 브라우저를 JPG 파일로 제한하고 싶습니다 <input type="file">.

특정 파일 유형을 검색 할 수 있습니까?


참조 http://www.w3schools.com/tags/att_input_accept.asp를 :

accept 속성은 Internet Explorer 및 Safari를 제외한 모든 주요 브라우저에서 지원됩니다. 정의 및 사용법

accept 속성은 서버가 수락하는 (파일 업로드를 통해 제출할 수있는) 파일 유형을 지정합니다.

참고 : accept 속성은와 함께 만 사용할 수 있습니다 <input type="file">.

팁 :이 속성을 유효성 검사 도구로 사용하지 마십시오. 파일 업로드는 서버에서 확인되어야합니다.

통사론 <input accept="audio/*|video/*|image/*|MIME_type" />

팁 : 둘 이상의 값을 지정하려면 값을 쉼표로 구분하십시오 (예 : <input accept="audio/*,video/*,image/*" />.


파일 대화 상자가 표시 될 때 올바른 (사용자 지정) 필터를 제공합니다.

<input type="file" accept=".jpg, .png, .jpeg, .gif, .bmp, .tif, .tiff|image/*">

<asp:FileUpload ID="FileUploadExcel" ClientIDMode="Static" runat="server" />
<asp:Button ID="btnUpload" ClientIDMode="Static" runat="server" Text="Upload Excel File" />

.

$('#btnUpload').click(function () {
    var uploadpath = $('#FileUploadExcel').val();
    var fileExtension = uploadpath.substring(uploadpath.lastIndexOf(".") + 1, uploadpath.length);

    if ($('#FileUploadExcel').val().length == 0) {
        // write error message
        return false;
    }

    if (fileExtension == "xls" || fileExtension == "xlsx") {
        //write code for success
    }
    else {
        //error code - select only excel files
        return false;
    }

});

과 함께 accept 속성을 사용할 수 있습니다. IE와 Safari에서는 작동하지 않습니다.

프로젝트 규모와 확장성에 따라 Struts를 사용할 수 있습니다. Struts는 업로드 된 파일 유형을 선언적 및 프로그래밍 방식으로 제한하는 두 가지 방법을 제공합니다.

자세한 정보 : http://struts.apache.org/2.0.14/docs/file-upload.html#FileUpload-FileTypes


사용자 정의 속성을 추가하고 속성에서 <input type="file" file-accept="jpg gif jpeg png bmp">제공하는 확장자와 일치하는 javascript 내의 파일 이름을 읽습니다 file-accept. 위의 확장자를 가진 텍스트 파일이 이미지로 잘못 인식되기 때문에 이것은 일종의 가짜입니다.

참고 URL : https://stackoverflow.com/questions/8938124/how-to-filter-input-type-file-dialog-by-specific-file-type

반응형