función image.onload con retorno

Solución:

El valor se devuelve, pero no de la detect función.

Si usa una función con nombre para el controlador de eventos de carga en lugar de una función anónima, es más claro lo que está sucediendo:

function handleLoad() {
  var result = [{ x: 45, y: 56 }];
  return result;
}

function detect(URL) {
  var image = new Image();
  image.src = URL;
  image.onload = handleLoad;
}

El valor se devuelve de la handleLoad función al código que llama al controlador de eventos, pero el detect La función ya ha salido antes de eso. Ni siquiera hay ninguno return declaración en el detect funcionar en absoluto, por lo que no puede esperar que el resultado sea otra cosa que undefined.

Una forma común de manejar escenarios asincrónicos como este es usar una función de devolución de llamada:

function detect(URL, callback) {
  var image = new Image();
  image.src = URL;
  image.onload = function() {
    var result = [{ x: 45, y: 56 }];
    callback(result);
  };
}

Llamas al detect función con una devolución de llamada, que se llamará una vez que el valor esté disponible:

detect('image.png', function(result){
  alert(result);
});

Esto se debe a que la función de detección no devuelve nada, ya que el evento de carga ocurre una vez finalizada la función. Y olvidó agregar la imagen a algo para que nunca se cargue.

Podrías hacer algo como:

function detect(URL) {
    var image = new Image();
    image.src = URL;
    image.onload = function() {
        var result="result"; // An example result
        alert(result); // Doesn't work
    }
    document.body.appendChild(image)
}

detect('http://www.roseindia.net/javascript/appendChild-1.gif');

violín aquí http://jsfiddle.net/LVRuQ/

Lo entiendo yo mismo:

No sabía que puedo asignar una variable a esa carga (para mí, ya estoy asignada).

function detect(URL) {
    var image = new Image();
    image.src = URL;
    var x = image.onload = function() {
        var result = [{ x: 45, y: 56 }]; // An example result
        return result;
    }();
    return x;
}

alert(detect('x'));

---

---

Utiliza Nuestro Buscador