2017-01-24 4 views
0

У меня есть функция JavaScript, которая проверяет изображение в нуле или нет, и вызовите функцию для преобразования изображения в строку base64, но после преобразования изображения также я не могу вернуть значение переменной всегда показывает undefiend. updateUserDetails его функция onclick, помогите мне решить ее.Получить возвращаемое значение из переменной в JavaScript

var userImgData; 
function updateUserDetails() { 

    if (userImgData === "undefined") { 

     ImgData = (document.getElementById("userProfileImage")); 
     getUserBase64Image(ImgData.src) 
    } 
    updateDetails(userImgData) 
} 

function updateDetails(userImgData) 
{ 
    //i am calling ajax to update 
} 

function getUserBase64Image(img) { 

var i = img; 
var canvas = document.createElement('canvas'), 
    ctx = canvas.getContext('2d'), 
    img = new Image(); 
img.onload = function() { 
    canvas.width = img.width; 
    canvas.height = img.height; 

    if (canvas.width > canvas.height) { 
     canvas.style.width = "320px"; 
    } else { 
     canvas.style.height = "300px"; 
    } 

    ctx.drawImage(img, 0, 0, canvas.width, canvas.height); 
    var dataURl = (canvas.toDataURL('image/jpeg')); 
    userImgData = dataURl.replace("data:image/jpeg;base64,", " ") 

    return userImgData ; 
} 
img.src = img; 
} 
+1

подумайте, где вы ждете возвращаемого значения? То есть где вы вызываете обработчик события onload? – Teemu

+0

Какая конкретная переменная 'undefined'? Где вы это определяете? – David

+0

Вы никогда не вызываете 'updateUserDetails()' нигде в этом коде, но даже если бы вы были, если вы явно не установили 'userImgData' в строковый литерал« undefined », ваше условие' if' завершится с ошибкой. То, что вы хотите сделать, это 'if (userImgData == undefined)' <- yes, use == not ===, или вы можете сказать 'if (typeof userImgData ===" undefined ")' – mhodges

ответ

0

функция OnLoad асинхронный, вы можете решить эту проблему с помощью обратного вызова следующим образом:

function updateDetails(customerImgData,CB) 
    { 
     //i am calling ajax to update 
    } 

     function getUserBase64Image(img) { 

    var i = img; 
    var canvas = document.createElement('canvas'), 
    ctx = canvas.getContext('2d'), 
    img = new Image(); 
    img.onload = function() { 
    canvas.width = img.width; 
    canvas.height = img.height; 

    if (canvas.width > canvas.height) { 
     canvas.style.width = "320px"; 
    } else { 
     canvas.style.height = "300px"; 
    } 

    ctx.drawImage(img, 0, 0, canvas.width, canvas.height); 
    var dataURl = (canvas.toDataURL('image/jpeg')); 
    userImgData = dataURl.replace("data:image/jpeg;base64,", " "); 

    CB(userImgData); 

    return userImgData ; 
    } 
img.src = img; 
} 

function updateUserDetails(imageData){ 
     //you will get image data here in variable "imageData", 
     //put your code here. 
} 

updateUserDetails(customerImgData,updateUserDetails);//function call. 
Смежные вопросы