Question

我正在开发一种网络架构，它可以对GET查询进行延迟响应。我希望能够从服务器接收图像。我试图增加显示功能的延迟时间，以便一旦从服务器获取它就可以绘制。我使用canvas来显示特定URI的图片。以下是我需要延迟运行的代码部分：

var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var img = new Image;
var strDataURI = nameStr;
img.onload = function(){
    context.drawImage(img,0,0, 150,150); // Or at whatever offset you like
};  
img.src = strDataURI;

请帮忙。提前谢谢。

Answer 1

有几种选择。如果您坚持要将其作为计时器，那么您可以使用setTimeout()。

window.setTimeout(function() { // function code here }, 3000);

您还可以将ajax调用设置为同步而不是异步。这将导致其他功能在运行之前等待它完成。

$.ajax({
  async: false
});

最后你可以把draw函数放在你的ajax调用的完整中。在ajax调用完成后运行此函数。

$.ajax({
  complete: function(result) {
    // code to perform the draw
  }
});

Answer 2

尝试setTimeout（此处参考http://www.w3schools.com/js/js_timing.asp）

Answer 3

建议

我的建议是不要拖延它。正如chockleyc所说，等待回应将是最好的选择。

例

有以下可能的情况：

您正在发出GET请求并等待回复
您没有手动发出请求，只是加载了页面

您手动发出GET请求

如果您自己进行GET查询，我的强烈建议是使用Promise，如下所示：

var getRequest = new Promise(function(resolve, reject){
    //We call resolve(...) when what we were doing async succeeded, and reject(...) when it failed.
    //In this example, we use setTimeout(...) to simulate async code. 

    var oReq = new XMLHttpRequest();

    oReq.onload = function(e) {
        resolve(oReq.response);
    }
    oReq.open("GET", "www.bananas.com");
    oReq.send();
});

然后你会像：

var getRequest()
    .then(console.log);

在这种情况下会打印响应。如果您不熟悉，我建议使用MDN Promises documentation。

另一种选择是简单地使用JavaScript中的XMLHttp而不承诺。您也可以在MDN documentation中阅读更多示例，或者如果您对kirupa tutorial进行尝试而感到困惑。

您没有手动发出GET请求

在这种情况下，我建议您收听GET请求，然后在响应到达后执行特定操作。对此可以找到一个很好的解决方案：

https://stackoverflow.com/a/3597640/1337392

您将在哪里找到一个可以收听所有GET请求的迷你图书馆。这样，每次收到GET请求时，您都可以根据需要对其进行过滤并执行代码。

如果以前的代码对您来说过于复杂，您还可以看看这个更简单的替代方案：

Listen to serve response JavaScript

你真的坚持使用计时器

迄今为止最糟糕的解决方案。为什么？尝试回答这些问题：

如果图像没有在您预期之前到达，会发生什么？而不是1秒，如果它需要2？
您如何确定GET请求需要多长时间？你会给出100个请求的中位数吗？如果你得到一个超出中位数的请求怎么办？
假设您总是等待最长的时间（以确保一切正常），为什么大多数用户的体验会较差？

但如果你坚持下去，那么“chockleyc”和“Johannes P”的回答都应该澄清你的所有问题。

现在一切都好，我希望它有所帮助！

如何在javascript中延迟执行特定功能？

3 个答案:

建议

例

您手动发出GET请求

您没有手动发出GET请求

你真的坚持使用计时器