0

複数のjquery投稿が完了したら、ビジーアイコンをクリアして削除ボタンを再度有効にしようとしています。これが私の現在のコードです：

    $('#deleteimgs').live('click', function(e) {
        e.preventDefault();

        if ($('input[name="chk[]"]:checked').length > 0 ) {

            $('#deleteimgs').button('loading');
            $('#saveicon').show();

            var boxes = $('input[name="chk[]"]:checked');
            $(boxes).each(function(){

                 var id = $(this).attr('id').substr(7);
                 var self = this;

                 $.post("/functions/photo_functions.php", { f: 'del', imgid: id}, function(data){
                    if (data.success) {
                        $(self).hide();
                        $("#img_"+id).hide(250);
                    }
                }, "json");
            });

            $('#saveicon').hide();
            $('#deleteimgs').button('reset');
        }

    });

foreachループが完了する前に、非表示呼び出しとリセット呼び出しがトリガーされています。これらの2つの呼び出しを行う前に、完了を待つ方法はありますか？

$('#saveicon').hide();
$('#deleteimgs').button('reset');
4

4 に答える 4

3

HTTPリクエストが終了したら、コールバックメソッドを使用しsuccessてタスクを完了する必要があります。コールバック内で、完了したリクエストの数を追跡し、最後のリクエストが終了したときに、目的のコードを実行する必要があります。

このコードはいくつかの方法で再構築できますが、状況を処理する方法の一般的な考え方が得られるはずです。

var boxes = $('input[name="chk[]"]:checked');
var totalBoxes = boxes.length;
var completedRequests = 0;

$(boxes).each(function(){

     var id = $(this).attr('id').substr(7);
     var self = this;

     $.post("/functions/photo_functions.php", { f: 'del', imgid: id}, function(data){
        if (data.success) {
            $(self).hide();
            $("#img_"+id).hide(250);

            //Increment the complete request count.
            completedRequests++;

            //Check if the last request has finished.  If it has, do your stuff!
            if (completedRequests == totalBoxes) {
                $('#saveicon').hide();
                $('#deleteimgs').button('reset');
            }
        }
    }, "json");
});
于 2012-07-20T20:00:29.797 に答える
1

次のようなものを試してください：

$(document).on('click', '#deleteimgs', function(e) {
    e.preventDefault();

    if ($('input[name="chk[]"]:checked').length > 0 ) {

        $('#deleteimgs').button('loading');
        $('#saveicon').show();

        var boxes = $('input[name="chk[]"]:checked'),
            xhr = [];
        boxes.each(function(){
             var self = this,
                 id = self.id.substr(7);

             var request = $.post("/functions/photo_functions.php", { f: 'del', imgid: id}, function(data){
                if (data.success) {
                    $(self).hide();
                    $("#img_"+id).hide(250);
                }
            }, "json");
            xhr.push(request);
        });

        $.when.apply(null, xhr).done(function() {
            $('#saveicon').hide();
            $('#deleteimgs').button('reset');
        });
    }
});​

これにより、すべてのリクエストが配列に格納され、後で$ .whenに渡され、すべてのリクエストが完了すると、done()関数が実行されます。

于 2012-07-20T20:12:00.987 に答える
0

投稿の数を数え、仲介関数を呼び出して返信を数え、すべての呼び出しが完了した後に非表示にしてリセットする必要があります。

例えば：

var postCount = 0;

function allPostsDone()
{
   $('#saveicon').hide();
   $('#deleteimgs').button('reset');
}

postCount += 1;
$.post("/functions/photo_functions.php",
       { f: 'del', imgid: id},
       function(data)
       {
         if (data.success)
         {
           $(self).hide();
           $("#img_"+id).hide(250);
         }

         postCount -= 1;
         if (postCount == 0)
         {
           allPostsDone();
         }
       }, "json");
于 2012-07-20T20:02:41.637 に答える
0

DwBの回答をフォローアップするには、非同期を使用するのが仲介機能を提供する簡単な方法です。それ以外の：

$(boxes).each(function(){

使用する：

async.parallel(boxes.toArray().map(function(elem){
    var self = elem;
    return function (callback) {
        var id = $(self).attr('id').substr(7);

        $.post("/functions/photo_functions.php", { f: 'del', imgid: id}, function(data){
            if (data.success) {
                $(self).hide();
                $("#img_"+id).hide(250);
                callback();
            } else {
                callback(new Error("request failed"));
            }
        }, "json");
    }
}), function (err) {
    if(err) {
        console.log(err);
    } else {
        $('#saveicon').hide();
        $('#deleteimgs').button('reset');
    }
});

それはうまくいくはずです。

于 2012-07-20T20:22:04.187 に答える