theo dõi

Gần nhất :

Thống kê câu hỏi

Chuyên mục : Lập trình
Topic : JavaScript
Hỏi lúc:
Lượt xem: 3,028

Làm thế nào có thể tải nên các tập tin không đồng bộ sử dụng jquery?

Nguyễn Thụy Linh Nguyễn Thụy Linh
 06  01  00
06 bình chọn hữu ích bởi Bùi Thúy Liên, Ngô Minh Thy Đặng Anh Phương ... (tất cả)

Mình muốn tải lên một tập tin không đồng bộ với jQuery. Đây là HTML của mình:

<span>File</span>
<input type="file" id="file" name="file" size="10"/>
<input id="uploadbutton" type="button" value="Upload"/>

Và mã code javascript:

$(document).ready(function () {
    $("#uploadbutton").click(function () {
        var filename = $("#file").val();

        $.ajax({
            type: "POST",
            url: "/upload/addfile",
            enctype: 'multipart/form-data',
            data: {
                file: filename
            },
            success: function () {
                alert("Thành công: ");
            }
        });
    });
});

Thay vì tập tin được tải lên, mình chỉ nhận được tên tập tin. Mình có thể làm gì để khắc phục vấn đề này? Cảm ơn các bạn

3,028 xem 09 theo dõi 06 hữu ích hỏi –

Bạn biết ai đó có thể trả lời câu hỏi này?. Bạn có thể giúp đỡ bằng cách tìm những người giỏi nhất:

user user user user user

Vũ Ðình Quảng Vũ Ðình Quảng
 07  00  03
02 bình chọn hữu ích bởi Hoàng Tuấn Lâm Vũ Hạ Vy

Tôi khuyên bạn nên sử dụng File Uploader cho mục đích này. Sau đây là mã code

$(document).ready(function() {
    $("#uploadbutton").jsupload({
        action: "/upload/addfile",
        onComplete: function(response){
            alert( "kết quả: " + response);
        }
    });
});
2,726 xem 02 hữu ích trả lời –
Hồ Bình Nguyên Hồ Bình Nguyên
 08  00  02
02 bình chọn hữu ích bởi Ngô Hiền Thục Dương Hùng Thịnh

Với html5 mới đây tôi có thực hiện tải lên 1 tập tin mà không sử dụng flash, iframe hay plugin nào khác

<form enctype="multipart/form-data">
    <input name="file" type="file" />
    <input type="button" value="Upload" />
</form>
<progress></progress>

Đầu tiên, bạn có thể làm một số xác nhận nếu bạn muốn. Ví dụ, trong các sự kiện onChange của file:

$(':file').change(function(){
    var file = this.files[0];
    var name = file.name;
    var size = file.size;
    var type = file.type;
    // xác nhận của bạn để kiểm tra file bạn muốn tải nên
});

Bây giờ xử lý button

$(':button').click(function(){
    var formData = new FormData($('form')[0]);
    $.ajax({
        url: 'upload.php',  //Server script to process data
        type: 'POST',
        xhr: function() {  // Custom XMLHttpRequest
            var myXhr = $.ajaxSettings.xhr();
            if(myXhr.upload){ // Check if upload property exists
                myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // For handling the progress of the upload
            }
            return myXhr;
        },
        //Ajax events
        beforeSend: beforeSendHandler,
        success: completeHandler,
        error: errorHandler,
        // Form data
        data: formData,
        //Options to tell jQuery not to process data or worry about content-type.
        cache: false,
        contentType: false,
        processData: false
    });
});

Bây giờ sử lý tiến trình upload (progress)

function progressHandlingFunction(e){
    if(e.lengthComputable){
        $('progress').attr({value:e.loaded,max:e.total});
    }
}

Chúc bạn thành công

2,728 xem 02 hữu ích trả lời –