使用Laravel / jquery异步加载图像

Question

我在一个文件夹中有一堆图像，我有以下疑问：我应该从Laravel动作返回什么？如何在客户端上加载图像时显示一些文字？

通常我在我的问题中包含一些我尝试过的代码，但我甚至不知道如何开始。 Google没有多大帮助，因为关键字“image”和“ajax”导致上传不下载问题。

Answer 1

你可以这样做：

<强> HTML

<div id="loadingDiv"><p>i'm loading...</p></div>        

<强> JS

var $loading = $('#loadingDiv').hide();

$(document)
  .ajaxStart(function () {
     $loading.show();
   })
   .ajaxStop(function () {
     $loading.hide();
   });


// your ajax calls

此处有更多信息：How to show loading spinner in jQuery?

Answer 2

我建议你发回JSON回复。 Controller的方法将找到正确的图像名称/相对路径，并返回JSON响应中打包的所有集合。您也可以添加任何其他信息。

return response()->json([
      'images' => <image-array-set>,
      'something_else' => $something_else_here
]);

然后在您的客户端/ Javascript中，您将解析此信息并相应地加载图像，并在此过程中执行您想要的任何其他操作。