相关疑难解决方法(0)

我发现queue()/ 上的jQuery.com文档dequeue()太简单了.jQuery中的队列究竟是什么？我应该如何使用它们？

我如何设计一个API来隐藏AJAX和HTTP请求的异步性质,或者基本上将其延迟以提供流畅的界面.要在Twitter的新Anywhere API中显示示例:

// get @ded's first 20 statuses, filter only the tweets that
// mention photography, and render each into an HTML element
T.User.find('ded').timeline().first(20).filter(filterer).each(function(status) {
    $('div#tweets').append('<p>' + status.text + '</p>');
});

function filterer(status) {
    return status.text.match(/photography/);
}

vs this(每个调用的异步性质清晰可见)

T.User.find('ded', function(user) {
    user.timeline(function(statuses) {
        statuses.first(20).filter(filterer).each(function(status) {
            $('div#tweets').append('<p>' + status.text + '</p>');
        });
    });
});

function filterer(status) {
    return status.text.match(/photography/);
}

它找到用户,获取他们的推文时间轴,仅过滤前20条推文,应用自定义过滤器,并最终使用回调函数来处理每条推文.

我猜这样设计良好的API应该像查询构建器(想想ORM)一样工作,每个函数调用构建查询(在这种情况下为HTTP URL),直到它遇到循环函数,如每个/ map /等.进行HTTP调用,传入函数成为回调函数.

一个简单的开发途径是使每个AJAX调用同步,但这可能不是最好的解决方案.我有兴趣找出使其异步的方法,并仍然隐藏AJAX的异步性质.

在片段中, $({}).queue(function(next){}) 什么$({})代表什么呢？为什么人们使用这种形式？

我在这里得到了这个答案的代码.

我在javascript函数中有一些jQuery,可以更改页面上的文本,并在特定的时间间隔内淡入淡出.我希望函数在每个函数完成其效果之后依次运行.

dialogueExchange1();
dialogueExchange2();
dialogueExchange3();

function dialogueExchange1() {
  $('.text-area1').text("hey");
  $('.text-area1').delay(1000).showDialogue(800, 3000).prepareDialogue(800, "hey, are you awake?");
}

function dialogueExchange2() {
  $('.text-area1').delay(900).showDialogue(800, 4000).prepareDialogue(800, "wake up").delay(900);

  $('.text-area2').text("...");
  $('.text-area2').delay(1200).showDialogue(800, 1500).fadeOut(800);
}

function dialogueExchange3() {
  $('.text-area1').delay(900).showDialogue(800, 4000).prepareDialogue(800, "let's go").delay(900);

  $('.text-area2').text("not yet");
  $('.text-area2').delay(1200).showDialogue(800, 1500).fadeOut(800);
}

该showDialogue和prepareDialogue是我创建的延迟的方法和淡入淡出的文本.这工作正常.基本上,我只是想在特定时间之后在文本区域选择器中更改文本.目前正在发生的是所有功能同时运行,从而同时触发文本更改效果.我想做dialogueExchange1它的效果,当它完成,为了dialogueExchange2做它的效果,然后当它完成,等等.

我已经尝试通过下面的解决方案来处理队列,超时和回调,但我还没有完全按照我的意愿去做:

如何避免回调链？

如何使用JQuery链接或排队自定义函数？

过去我有这个工作,只需将所有文本更改方法链接在一行代码中就可以完成我想要的工作,但它看起来很糟糕.将它分解为函数并按顺序运行它会使它更有条理,更有助于跟踪文本更改和延迟时间.谢谢!

编辑:showDialogue和prepareDialogue按要求的功能

$.fn.showDialogue = function(fadeInTime, showTextTime) {
    this.fadeIn(fadeInTime).delay(showTextTime);
    return this;
};

$.fn.prepareDialogue = function(fadeOutTime, dialogue) {
    this.fadeOut(fadeOutTime, function() {
        $(this).html(dialogue);
    });
    return this;
};

解决方案编辑2:感谢大家的回应,并首先建议使用 …

就像如何避免"如果"链？,这个问题是关于保持异步程序清洁应该做些什么.

异步编程是一种完全不同于程序编程的范例,当你了解它时它真的很有趣.但是,当您有多个异步调用时,它可能会变得混乱.

考虑这个例子(这是我遇到的现实场景的抽象):

1. 读取文件 a.txt
2. 将内容提交a.txt给服务器X进行处理并检索输出.
3. 读取文件b.txt.
4. 将b.txt服务器的内容和响应X(步骤2)发送到服务器Y,并获取输出.
5. 将服务器的响应Y(步骤4)保存到c.txt.

使用异步调用,我的JavaScript看起来与此类似(函数名称组成.所有函数都是带回调的异步调用.省略了错误参数以提高清晰度.带有错误参数和错误处理的实际代码比这更麻烦):

readFile('a.txt', function (file_a_data) {
    requestToServer('http://xserver.com/', file_a_data, function (server_x_response) {
        readFile('b.txt', function (file_b_data) {
            var request_params = server_x_response + file_b_data;
            requestToServer('http://yserver.com/', request_params, function (server_y_reponse) {
                writeFile('c.txt', server_y_response);
            });
        });
    });
});

正如您所看到的,已经有四个级别的缩进,并且正在构建一个代码箭头.我们如何避免这种回调嵌套,并编写一些干净的代码？

到目前为止我尝试了什么:

• 这样做的一种方法是尽可能编写函数的同步,无回调版本.返回一个值并抛出错误异常.

  try {
      var file_content = readFile('a.txt');
      // do stuff with file_content
  } catch (ex) {
      // an error …

  Run Code Online (Sandbox Code Playgroud)