Question

我正在使用以下代码对ajax请求进行排队，而不是阻止页面上的操作。问题是，我需要显示一个加载图标，表明队列的执行没有完成。我无法弄清楚如何做到这一点，我尝试过的所有事情都会立即关闭。

  // jQuery on an empty object, we are going to use this as our Queue
  var ajaxQueue = $jq({});

  $jq.ajaxQueue = function( ajaxOpts ) {
    var jqXHR,
        dfd = $jq.Deferred(),
        promise = dfd.promise();

    // queue our ajax request
    ajaxQueue.queue( doRequest );

    // add the abort method
    promise.abort = function( statusText ) {
        // proxy abort to the jqXHR if it is active
        if ( jqXHR ) {
            return jqXHR.abort( statusText );
        }
        // if there wasn't already a jqXHR we need to remove from queue
        var queue = ajaxQueue.queue(),
            index = $jq.inArray( doRequest, queue );

        if ( index > -1 ) {
            queue.splice( index, 1 );
        }
      // and then reject the deferred
      dfd.rejectWith( ajaxOpts.context || ajaxOpts,
            [ promise, statusText, "" ] );
      return promise;
    };

    // run the actual query
    function doRequest( next ) {
        jqXHR = $jq.ajax( ajaxOpts )
            .done( dfd.resolve )
            .fail( dfd.reject )
            .then( next, next );
    }
    return promise;
};

Answer 1

您可以在页面上创建一个div来保存您的图标。在这种情况下，我会使用加载gif图标。当您首次在页面上触发ajax时，使用.show（）来显示它然后在.done中使用.hide（）

与此帖How can I display a loading gif until an entire html page has been loaded

相似

ajaxQueue加载图标

1 个答案: