Cách lọc loại đầu vào = "tệp" hộp thoại theo loại tệp cụ thể?

Question

Tôi muốn giới hạn trình duyệt thành tệp JPG khi tôi nhấp vào nút duyệt của <input type="file">.

Có thể duyệt các loại tệp cụ thể không?

Answer 1

Xem http://www.w3schools.com/tags/att_input_accept.asp:

Các thuộc tính chấp nhận được hỗ trợ trong tất cả các trình duyệt chính, trừ Internet Explorer và Safari. Định nghĩa và Cách sử dụng

Thuộc tính chấp nhận chỉ định các loại tệp mà máy chủ chấp nhận (có thể được gửi qua tệp tải lên).

Lưu ý: Thuộc tính chấp nhận chỉ có thể được sử dụng với <input type="file">.

Mẹo: Không sử dụng thuộc tính này làm công cụ xác thực. Tải lên tệp phải được xác thực trên máy chủ.

Cú pháp <input accept="audio/*|video/*|image/*|MIME_type" />

Mẹo:.. Để chỉ định nhiều hơn một giá trị, tách các giá trị với một dấu phẩy (ví dụ <input accept="audio/*,video/*,image/*" />

Answer 2

Bạn có thể sử dụng chấp nhận thuộc tính cùng với Nó không làm việc trong IE và Safari

Tùy thuộc vào quy mô dự án và khả năng mở rộng của bạn, bạn có thể sử dụng Struts Struts cung cấp hai cách để giới hạn loại tệp được tải lên, khai báo và lập trình ly.

Để biết thêm thông tin: http://struts.apache.org/2.0.14/docs/file-upload.html#FileUpload-FileTypes

Answer 3

Thêm một thuộc tính tùy chỉnh để <input type="file" file-accept="jpg gif jpeg png bmp"> và đọc tên tập tin trong javascript phù hợp với phần mở rộng được cung cấp bởi các thuộc tính file-accept. Đây sẽ là loại không có thật, vì một tệp văn bản có bất kỳ phần mở rộng nào ở trên sẽ bị xóa nhầm dưới dạng hình ảnh.

Answer 4

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

}); 

Answer 5

này sẽ cung cấp chính xác bộ lọc (tùy chỉnh) khi hộp thoại tập tin đang hiển thị:

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