entrada = "imagen" si no se encuentra la imagen src

Question

estoy usando la siguiente función JavaScript para ocultar las imágenes de mi página web en caso de que la imagen de origen no se encuentra:

function Image_OnError(image) { 
    image.onerror = ""; 
    image.style.visibility = "hidden"; 
    return true; 
} 

añado lo siguiente atribuir a mis imágenes que llama al método anterior en el caso de un error onerror="Image_OnError(this);".

El problema es que tengo que hacer lo mismo para <input type="image" /> elementos, pero no puedo encontrar la manera de hacer esto como el elemento de entrada no parece tener un evento OnError.

Podría simplemente incluir una imagen extra con el mismo valor src que la entrada y luego modificar la visibilidad del elemento de entrada en el evento OnError de la imagen, pero parece un poco desordenado.

Answer 1

Si desea un semi-hack, puede usar el evento "document.ready" de jQuery y verificar el alto de la entrada.

EDIT: En respuesta a usted es la respuesta a la pregunta de por encima de aviador ... Se podía usar un ASP: LinkButton, y envolver una imagen dentro de ella como contenido ... y luego utilizar el evento bajo demanda de el LinkButton.

Answer 2

Tiene el mismo evento onerror. Esta funciona para mí (en cromo al menos):

<input type="image" onerror="alert(1);" src="http://xxx" /> 

Otra forma posible es para cargar la imagen en JS:

de la carga de documentos:

$('input[type="image"]').each(function(){ 
    var img = new Image(); 
    var input = this; 
    img.onerror = function() { Image_OnError(input); } 
    img.src = this.src; 
}) 

Además, es mejor ocultarlos desde el principio y mostrar solo los elementos con la imagen cargada con éxito. De lo contrario, es probable que tengas elementos saltando en la página.