Optimiere jquery image load

Question

Ich habe einen Image-Manager erstellt und ich lade jede URL mit jquery, aber wenn ich die 'src' Attribute in der Ajax-Anfrage ändere, dauert das Bild einige Sekunden, um im Browser zu erscheinen versucht, einen Spinner zu platzieren und warten, um alles anzuzeigen, sobald die Anfrage lädt, aber immer noch, wenn ich überprüfen, das 'src' Attribut die URL bereits geladen ist, aber nicht das Bild, habe ich auch versucht, dieses Problem zu lösen, indem Sie meine Anfrage hinein die Jquery-Load-Methode, aber auch nicht funktioniert, was kann in diesen Fällen getan werden?

 $(window).on("load", function() { 
     $.ajax({ 
       async:true, 
       cache:false, 
       dataType: 'json', 
       type: 'get', 
       url: 'cargarBanner', 
       success: function(data){ 
        ajax_start(); 
       if (data.success==true) 
       { 
        for(var i=0;i<data.banner.length;i++) 
       { 

        switch(data.banner[i].banner_type) 
        { 
         case "encabezado": 
         $("#"+data.banner[i].banner_type+" img").attr('src',flagsUrl+"/"+data.banner[i].banner_image); 
         break; 

         case "bsq-superior": 
         $("#"+data.banner[i].banner_type+" img").attr('src',flagsUrl+"/"+data.banner[i].banner_image); 
         break; 

         case "bsq-inferior": 
         $("#"+data.banner[i].banner_type+" img").attr('src',flagsUrl+"/"+data.banner[i].banner_image); 
         break; 
        } 



       } 
       } 

       }, 
       complete: function(response) { 
        alert("listo"); 
       ajax_stop(); 
        }, 
       //si ha ocurrido un error 
       error: function(data){ 
        alert("ha ocurrido un error") ; 

       } 
      }); 
    });` 

**** UPDATE **

ich meine Methode auf diese Weise

public function cargarBannerT(Request $request) 
    { 
     $banner=$estados = DB::table("banners")->select('banner_image')->where('banner_type','=',$request->tipo)->get(); 
     if (count($banner)>0) { 
      return $banner[0]->banner_image; 

     } 


    } 

in diesem Fall geändert haben, wobei das Verfahren die URL des Bildes zurückzukehren „1498501452.jpg " jedoch im html, nur Klartext angezeigt wird, und ein gebrochenes Bild "src =" ../ images/cargarBannerT? tipo = encabezado"

Answer 1

wie ich sehe, Sie fordern als Service, der Ihre Bild-URLs zurückgibt. Nachdem Sie die URLs geändert haben, muss der Browser die Bilder noch von der neuen URL herunterladen und anzeigen.

Ich denke, Ihr cargarBanner Dienst sollte auf die Bild-URL umleiten. Sobald Sie es tun, müssen Sie nur den Dienst direkt von Ihrer Bildquelle aufrufen. Etwas wie:

<img src="cargarBanner?param1=value1&param2=value2&..."/> 

Auf diese Weise wird der Browser Ihren Dienst aufrufen, ohne dass die Ajax-Aufruf