如何从javascript函数中获取值

How to get value from javascript function?

本文关键字：获取 函数 javascript      更新时间：2023-09-26

这是我的代码。我想返回front_image的值，但它返回的是空白字符串。

function get_front_image(callbackFunction){
    var front_image="";
    html2canvas($('#selector'), {
        onrendered: function(canvas) {
             front_image=canvas.toDataURL();
             callbackFunction(front_image);
        }
    });
}

我正试图像这个一样获得front_image的值

var f;
    var a=get_front_image(function(value){
      f= value;
     });
    alert(f);// it returns blank

我怎样才能从这个函数中得到这个值？请给我答案。提前感谢

在函数get_front_image中，为变量front_image分配一个空字符串，然后调用具有onrendered函数的html2canvas函数。这个函数被称为异步函数，所以当您返回front_image变量时，onrendered函数还没有被调用，这意味着front_image仍然是一个空字符串。

大多数情况下，在执行异步操作时，您将使用回调函数。这里可能看起来像这样：

function get_front_image(callbackFunction){
    var front_image="";
    html2canvas($('#selector'), {
        onrendered: function(canvas) {
             front_image=canvas.toDataURL();
             callbackFunction(front_image);
        }
    });
}
var f;
get_front_image(function(value){
    f = value;
    alert(f); //will return your value
});
alert(f); //Wont alert your value

明确执行的顺序：

  1. Var f声明为var f;
  2. 调用get_fron_image，并调用html2canvas函数。这是异步，所以onrendered函数将在它完成时被调用，我们不知道什么时候会发生这种情况
  3. 执行alert(f); //wont alert your value行。由于尚未调用onrendered函数，因此f还没有值
  4. 最后，执行onrendered函数，并调用callbackFunction，其中alert(f);按预期显示您的值。无论您想对变量f执行什么操作，都必须在callbackFunction中执行才能工作

html2canvas onrender将异步运行，然后您的函数将返回未初始化的空var。

因此，我们必须对长时间运行的任务使用回调函数。您可以实现以下功能。

function get_front_image(callback){
 html2canvas($('#selector'), {
    onrendered: function(canvas) {
      var url = canvas.toDataURL();
      callback(url);
    }
});
}

并调用如下函数。

get_front_image(function(link){
alert(link);
});
相关文章：