2011-08-19 35 views
7

Thông thường, để tải lên một tệp, đó là quy trình gồm hai bước - chọn một tệp và sau đó xác nhận tải lên. Tôi đang làm việc để tải lên ảnh tiểu sử. Vì ảnh hồ sơ thường nhỏ, tôi muốn giảm số lần nhấp chuột cho người dùng của mình bằng cách thực hiện tải lên tệp để bắt đầu khi chọn tệp. Xin đề nghị tốt, và có lẽ phổ biến, cách để đạt được điều này (tôi cũng muốn tìm hiểu những cạm bẫy của họ, nếu có). Cảm ơn.bắt đầu tải lên tập tin khi lựa chọn

Trả lời

6

Sự kiện change sẽ kích hoạt khi tệp được chọn từ trường tải lên tệp. Giá trị của trường sẽ là '' nếu không có tệp nào được chọn (trường bị xóa).

<form method="post" action="upload.script"> 
    <input type="file" id="formfile"/> 
    <input type="submit" id="formsubmit"/> 
</form> 

<script type="text/javascript"> 
    var file= document.getElementById('formfile'); 
    var submit= document.getElementById('formsubmit'); 

    // If scripting is available, can auto-submit the form, so no submit 
    // button needed. 
    // 
    submit.parentNode.removeChild(submit); 

    // When field is filled in with a filename, submit form 
    // 
    file.onchange= function() { 
     if (this.value!=='') 
      this.form.submit(); 
    }; 
</script> 

Đây có phải là một ý tưởng hay không? Nghi vấn. Tự động gửi biểu mẫu nếu người dùng không mong đợi biểu mẫu có thể có tác động tiêu cực.

+0

Cảm ơn bạn đã cung cấp giải pháp của mình. Đối với vấn đề bạn đã đề cập, tôi nghĩ rằng nó sẽ không gây ra mối quan tâm lớn trong trường hợp của tôi. – tamakisquare

+0

Cuộc gọi đến form.submit() sẽ thất bại trên IE8 và thấp hơn khi truy cập bị từ chối. –

+0

@Maurice:? làm việc tốt cho tôi trong IE6. – bobince

3

Bạn có thể sử dụng JQuery để tự động gửi hồ sơ cho các sever theo sự lựa chọn ...

vấn đề:

gì nếu doesnt người dùng muốn chọn tập tin đó nhưng các tập tin đã được tải lên máy chủ?

Điều gì sẽ xảy ra nếu tệp trước đó diễn ra trước khi tệp tải lên xong?

Làm thế nào về thời điểm người dùng không làm gì và đóng trang? Bạn sẽ lưu giữ tệp

1

Nếu bạn sử dụng Gmail, bạn sẽ nhận thấy chúng có giải pháp kéo thả để đính kèm tệp vào e-mail. Kéo từ màn hình của bạn lên vùng được xác định trước và wallah.

Nếu bạn có hỗ trợ HTML5 cho những người đang sử dụng tính năng này (hầu hết nếu họ cập nhật) thì bạn có thể sử dụng tính năng kéo thả được tích hợp vào HTML5.

Hãy thử nhìn vào này: http://www.thebuzzmedia.com/html5-drag-and-drop-and-file-api-tutorial/

Bạn cũng có thể cung cấp cho một cái gì đó giống như Plupload thử (http://www.plupload.com/) nhưng điều đó có thể là quá mức cần thiết cho việc này. Plupload là nhiều hơn sẽ phù hợp cho các tập tin lớn hơn cần hình ảnh động tiến bộ và chunking. Tuy nhiên, tôi biết bạn sẽ có thể viết kịch bản sao cho quá trình tải lên bắt đầu ngay lập tức và bạn chuyển hướng ngay sau khi quá trình tải lên hoàn tất. Nó cũng có thể cần công việc phía máy chủ mà bạn không được thiết lập.

Các vấn đề liên quan