1

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>

アヤックス:

$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の進捗状況を示しています。しかし、つまり、アップロードの進行状況には入りません。そこにアラートを入れても、ieに表示されません。

4

0 に答える 0