Question

我一直在研究这段代码，按照我的意愿制作功能，但最后我想我错过了一些非常大的东西：文件似乎没有上传。进度条已经完美调整，对话框运行良好，没有文件正在上传。

发生了什么事？

我的Javascript：

    fileCount = 0;
    barWidth = 0;

$(function() {
var uploader = new plupload.Uploader({
    runtimes : 'flash',
    browse_button : 'pickfiles',
    max_file_size : '10mb',
    url : 'js/upload/upload.php',
    resize : {width : 700, height : 700, quality : 90},
    flash_swf_url : 'js/upload/plupload.flash.swf',
    filters : [
        {title : "Image files", extensions : "jpg,gif,png"},
    ]
});

uploader.bind('Init', function(up, params) {

});

uploader.bind('FilesAdded', function(up, files) {
    $.each(files, function(i, file) {
        fileCount ++
        $('#uploadfiles').fadeIn(200);
        $('#filelist').append(
            '<div id="' + file.id + '">' +
            file.name + ' (' + plupload.formatSize(file.size) + ') <b></b>' +
        '</div>');
    });
});

uploader.bind('FileUploaded', function(up, file) {
    console.log(file.name);
    $('#'+ file.id).fadeOut(200);
});

uploader.bind('UploadProgress', function(up, file) {

    barWidth = barWidth+(file.percent/fileCount)

    $('#progressBar').animate({"width":barWidth+"%"},300);
        if (barWidth == 100 ) {$('#progressBox').delay(2000).fadeOut(200)};
    });

$('#uploadfiles').click(function(e) {
    e.preventDefault();
    $('#filelist').fadeIn(200, function() {
        $('#progressBox').fadeIn(200, function() {
            uploader.start();
        });
    });
});

uploader.init();
});

我的HTML（根据以下评论更新）：

<form method="post" action="js/upload/upload.php" enctype="multipart/form-data">
    <div>
        <button id="pickfiles" href="#">Add...</button> 
        <button id="uploadfiles" href="#">Upload</button>
        <br />
        <div id="filelist"></div>
        <div id="progressBox"><div id="progressBar"></div></div>
    </div>
</form>

Plupload自定义配置问题，有什么想法吗？

1 个答案: