Как получить значение из функции JavaScript?

0

Вот мой код. Я хочу вернуть значение front_image но возвращает его пустую строку.

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

im пытается получить значение front_image как это

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

как я могу получить это значение из этой функции, пожалуйста, предложите мне ответ. заранее спасибо

Теги:
canvas
html5-canvas

2 ответа

2
Лучший ответ

В вашей функции get_front_image вы назначаете пустую строку переменной front_image, тогда вы вызываете функцию html2canvas, которая имеет функцию onrendered. Эта функция называется асинхронным, так что к тому времени, когда вы возвращенная 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 alert(f);//wont alert your value строка alert(f);//wont alert your value выполнена. Поскольку функция onrendered еще не была вызвана, f еще не имеет значения.
  4. В конце концов, функция onrendered выполняется, и onrendered функция callbackFunction, где alert(f); показывает ваше значение, как ожидалось. Что бы вы ни делали с вашей переменной f должно произойти в функции callbackFunction, чтобы работать.
  • 0
    вар ф; get_front_image(function(value){ f = value; alert(f);// it alerts here }); alert (f);// but not here :(
  • 0
    это не выходит из строя
Показать ещё 5 комментариев
0

html2canvas onrendered будет запускаться асинхронно, а затем ваша функция возвращает пустой var, который не был инициализирован.

Таким образом, мы должны использовать функции обратного вызова для длительных задач. Вы можете реализовать свои функции, как показано ниже.

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

И вызовите функцию, как показано ниже.

get_front_image(function(link){
alert(link);
});
  • 0
    почему это здесь `var canvas = document.getElementById (" myCanvas "); `
  • 0
    Мне нужно var link= get_front_image(function(link){ }); alert(link)
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню