Question

我使用ajax和php上传图片文件。

这是代码，

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>

<form action="fileup.php" method="post" enctype="multipart/form-data">
                <input type="file" id="fileup" name="file" accept="image/*" style="position:relative; left:-105px; top:30px; opacity:0; z-index:10; cursor:pointer;" >
            </form>

<div class="progress">
        <div class="bar"></div >
        <div class="percent">0%</div >
    </div>

    <div id="status" style = "position:relative; top:-20px; left:150px;"></div>

的Ajax：

$jq(function() {

var bar = $jq('.bar');
var percent = $jq('.percent');
var status = $jq('#status');


$jq('form').ajaxForm({

    beforeSend: function() {
        status.empty();
        var percentVal = '0%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
    uploadProgress: function(event, position, total, percentComplete) {
        var percentVal = percentComplete + '%';
        bar.width(percentVal)
        percent.html(percentVal);
        status.html("Uploading...");
    },
    complete: function(xhr) {
        bar.width("100%");
        percent.html("100%");
        status.html("Upload complete");
        isrc = xhr.responseText; 
        handleFiles(files);     
    }
}); 

$jq("#fileup").change(function () {
files = this.files;
        $jq('form').submit();           
}); 
});

PHP代码，

<?php
$target_path = "uploaded_images/";

$file_name = $_FILES["file"]["name"];
$random_digit=rand(0000,9999);
$new_file_name=$random_digit.$file_name;

$target_path = $target_path . basename( $new_file_name); 

if(move_uploaded_file($_FILES['file']['tmp_name'], $target_path)) {
    echo   basename( $new_file_name);
} else{
    echo "There was an error uploading the file, please try again!";
}
?>

它工作正常，它显示了chrome和firefox的进度。但即使它没有进入上传进度。我甚至在那里发出警报，但它没有出现在... ...

文件上传中的上传进度选项在I.E中不起作用

0 个答案: