Vérifiez si l'image existe avec l'url donnée à l'aide de jquery

Question

Je veux vérifier si une image existe à l'aide de jquery.

Par exemple, comment puis-je vérifier cette image existe

http://www.google.com/images/srpr/nav_logo14.png 

le chèque doit me donner une 200 ou le statut ok

--------------édité-------------------

var imgsrc = $(this).attr('src');
var imgcheck = imgsrc.width;


if (imgcheck==0) {
alert("You have a zero size image");
} else { //do rest of code }

Merci Jean

Answer 1

Utiliser l' error gestionnaire comme ceci:

$('#image_id').error(function() {
  alert('Image does not exist !!');
});

Si l'image ne peut pas être chargé (par exemple, parce qu'il n'est pas présent à l'URL fournie), l'alerte est affichée:

Mise à jour:

Je pense à l'aide de:

$.ajax({url:'somefile.dat',type:'HEAD',error:do_something});

serait suffisant pour vérifier une erreur 404.

Plus De Lectures:

• http://www.jibbering.com/2002/4/httprequest.html
• http://www.ibm.com/developerworks/web/library/wa-ajaxintro3/

Mise à jour 2:

Votre code devrait ressembler à ceci:

$(this).error(function() {
  alert('Image does not exist !!');
});

Pas besoin de ces lignes et qui ne vérifie pas si le fichier distant existe de toute façon:

var imgcheck = imgsrc.width;    

if (imgcheck==0) {
  alert("You have a zero size image");
} else { //do rest of code }

Answer 2

$.ajax({
    url:'http://www.example.com/somefile.ext',
    type:'HEAD',
    error:
        function(){
            //do something depressing
        },
    success:
        function(){
            //do something cheerful :)
        }
});

de: http://www.ambitionlab.com/how-to-check-if-a-file-exists-using-jquery-2010-01-06

Answer 3

si il n'existe pas de charge par défaut de l'image ou de gérer l'erreur

$('img[id$=imgurl]').load(imgurl, function(response, status, xhr) {
    if (status == "error") 
        $(this).attr('src', 'images/DEFAULT.JPG');
    else
        $(this).attr('src', imgurl);
    });

Answer 4

À partir d' ici:

// when the DOM is ready
$(function () {
  var img = new Image();

  // wrap our new image in jQuery, then:
  $(img)
    // once the image has loaded, execute this code
    .load(function () {
      // set the image hidden by default    
      $(this).hide();

      // with the holding div #loader, apply:
      $('#loader')
        // remove the loading class (so no background spinner), 
        .removeClass('loading')
        // then insert our image
        .append(this);

      // fade our image in to create a nice effect
      $(this).fadeIn();
    })

    // if there was an error loading the image, react accordingly
    .error(function () {
      // notify the user that the image could not be loaded
    })

    // *finally*, set the src attribute of the new image to our image
    .attr('src', 'images/headshot.jpg');
});