0

ユーザーにアップロードを許可し、アップロードの進行状況を追跡し、アップロードの完了後にそれらをリダイレクトする単純な Web ページの次のコードがあります (これはサーバー側で行う必要があります)。アップロードの進行状況を表示するスクリプト。リダイレクトを妨げている ajax 呼び出しに何かありますか? 私のバックエンドは Google App Engine の Python です。喜んでコードを示しますが、関連性はないと思います。

<style>
.progress { position:relative; width:400px; border: 1px solid #ddd; padding: 1px; border-radius: 3px; }
.bar { background-color: #B4F5B4; width:0%; height:20px; border-radius: 3px; }
.percent { position:absolute; display:inline-block; top:3px; left:48%; }
</style>


<div class="row">
    <div class="span12">
        <div class="center-it"><h1>Upload a Video:</h1><br>
        </div>

        <form action="{{upload_url}}" method="POST" enctype="multipart/form-data">
            <input type="file" name="file" class="btn"><br> 
            <input type="submit" name="submit" value="Submit" class="btn"> 
        </form>

    </div>
</div>

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

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

#without everything below this line it works just fine
<script>
(function() {

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

$('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);
    },
    success: function() {
        var percentVal = '100%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
    complete: function(xhr) {
        status.html(xhr.responseText);
    }
}); 

})();       
</script>
4

1 に答える 1

1

フォームがサーバー上の別のページに送信され、そこで別の URL にリダイレクトできるため、Ajax がなくても機能します。Ajax を使用すると、まだ同じページにあり、サーバーからの応答のみを受信します。

URL を応答の一部として送信し、JavaScript でwindow.locationまたはを使用して新しい URL にリダイレクトできます。window.navigate

于 2013-07-24T01:14:11.903 に答える