优化jQuery图像负载

Question

我已经创建了一个映像管理器，但是我正在加载每个URL，但是，当我在Ajax请求中更改'src'属性时，图像需要几秒钟才能显示在浏览器，我试图放置一个旋转器并在请求加载后等待显示所有内容，但是，如果我检查" src"属性，则URL已经加载了，但图像却没有，我也试图通过将我的请求放在jQuery加载方法中，但我也无法工作，在这些情况下可以做什么？

     $(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") ;
                }
            });
    });`

****更新**

我将方法更改为这种方式

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;
        }

    }

在这种情况下，该方法返回图像" 1498501452.jpg"的URL，但是，在HTML中，仅出现纯文本，并且图像损坏" src =" ../images/cargarbannert？tipo = encabezado"

Answer 1

如我所见，您正在调用返回图像URL的服务。一旦更改URL，浏览器仍必须从新URL下载图像并向它们显示。

我认为您的 Cargarbanner 服务应重定向到图像URL。一旦这样做，您只需直接从图像源调用服务即可。类似：

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

这样，浏览器将无需这样做Ajax调用