JQueryで画像をプレロードする

Question

私はかなりの時間をかけて検索しています。jquery ajax呼び出しから取得した画像をプリロードするにはどうすればよいのでしょうか。

.ajax呼び出しによって "〜1_〜2_ etc"のような応答が生成されます。

$(".showPixFeature.hidden").live('click', function() { 
     var adID = this.id.split('_'); 
     $("#" + adID[0] + '_' + adID[1]).hide(); 
     $.ajax({ 
     type: "POST", 
     url: "../classifieds/classAdPics.php", 
     data: "ID="+ this.id, 
     success: function(r){ 
      var images = r.split('~'); 
      var thumbs = ''; 
       var i=0; 
       if(((images.length) - 1) > 1){ 
       for (i=1;i<=(images.length) - 1;i++) 
       { 
       thumbs = thumbs + '<img src="../images/listings/' + adID[1] + '_' + images[i] + '_sm.jpg" id="' + adID[1] + '_' + images[i] + '" class="thumbNails">'; 
       } 
       } 
       thumbs = thumbs + '<div><img src="../images/listings/' + adID[1] + '_1_.jpg" id="' + adID[1] + '_Preview" class="thumbNails"></div>'; 
      $("#" + adID[0] + '_' + adID[1]).html(thumbs).slideDown(); 
      } 
     }); 
    $(this).attr("src", "../images/close_pix.png"); 
    $(this).removeClass('hidden').addClass('shown'); 
    }); 
    $(".showPixFeature.shown").live('click', function() { 
     var adID = this.id.split('_'); 
     $("#" + adID[0] + '_' + adID[1]).slideUp(); 
     $(this).attr("src", "../images/class_see_more.png"); 
     $(this).removeClass('shown').addClass('hidden'); 
    }); 
    $(".thumbNails").live('click', function() { 
     var adID = this.id.split('_'); 
     $('#' + adID[0] + '_Preview').hide().attr('src', '../images/listings/' + this.id + '_.jpg').fadeIn('500'); 
    }); 

.slideup（）呼び出しの前に呼び出されている画像をプリロードしたいと思います。

ありがとうございます。

Answer 1

イメージをloadまで待つ場合は、.loadを使用してハンドラをイメージにバインドできます。このようなもの：

$（ '＃myImage'）。load（function（）{ //イメージの読み込みが完了すると、これが発生します。 }）;