0

FormData と XMLHttpRequest を使用して ajax 経由で複数のファイルを送信するのに適したコードがあります。

            for (var i=0, j=this.files.length; i<j; i++) {
            file = this.files[i];

            var formdata = new FormData();          
                formdata.append("images[]", file);


            var xhr = new XMLHttpRequest(),
                upload = xhr.upload,
                id = Math.floor((Math.random() * 100000));

                upload.addEventListener("loadstart", function(e){
                        showUploadedItem(file, this.id);
                });
                upload.id = id;
                upload.onprogress = function(e) {
                    var done = e.position || e.loaded, total = e.totalSize || e.total;
                    )
                };
                upload.onload = function(e) {

                    if (this.status == 200) {
                      console.log('');
                    }                        
                };
                xhr.onreadystatechange = function(e) {
                    if ( 4 == this.readyState ) {
                        console.log('');
                    }
                };
                xhr.open('post', '<?php echo Yii::app()->createUrl('url') ?>', true);
                xhr.send(formdata);                    
        }

ループ内で各ファイルを新しい XMLHttpRequest オブジェクトとして送信しているため、すべてのリクエストがいつ終了するかわかりません。

誰でも助けることができますか？

4

2 に答える 2

1

XMLHttpRequest のドキュメントを参照してください。

私が考えることができるいくつかのオプションがあります。それらのそれぞれに「loadend」コールバックを使用し、ループの外側で変数をインクリメントして、それぞれで送信されたリクエストの合計量を確認できます。カウントがリクエストの総数に達すると、任意のロジックを実行したり、呼び出したい関数を呼び出したりできます。

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest?redirectlocale=en-US&redirectslug=DOM%2FXMLHttpRequest%2FUsing_XMLHttpRequest

それ以外の場合は、async パラメーターを false に設定することもできますが、それぞれが終了するのを待ってから他のパラメーターを開始することになり、パフォーマンスが低下します。

于 2013-05-29T03:52:13.723 に答える
0

あなたの答えに基づいて、私の解決策;

        var x = 0;
        var lenght = this.files.length;
        for (var i=0, j=lenght; i<j; i++) {

        // code here                   

            var xhr = new XMLHttpRequest(),

             // code here  

                xhr.onreadystatechange = function(e) {
                    if ( 4 == this.readyState && this.status == 200 ) {
                        x++;
                        if(x == lenght) {
                            window.setTimeout( function(){
                                alert('finish');
                             }, 1000 );
                        }
                    }
                };
             // code here
          }

些細な機能ですが、機能します。

于 2013-05-29T12:12:52.117 に答える