2017-03-25 12 views
0

フォルダに画像がたくさんあり、次の疑問があります。Laravelのアクションから何を返す必要がありますか?画像がクライアントにロードされている間にテキストを表示するには?Laravel/jqueryと非同期に画像を読み込む

通常、私は私の試みたいくつかのコードを含みますが、私はどのように起動するのかも分かりません。キーワード「画像」と「ajax」がダウンロードの問題ではなくアップロードにつながるため、Googleはあまり役に立ちません。

+0

'load'イベント、 'img.addEventListener(' load '、showImage)'のようなイベントが必要なのは、イメージコンテナ内のテキストを隠してイメージを表示するだけです。 asyncについて - 既定で非同期に読み込まれたイメージ –

答えて

0

私はwoul JSONレスポンスを送り返すことをお勧めします。コントローラのメソッドは、正しいイメージ名/相対パスを見つけ、JSONレスポンスにパッケージ化されたすべてのセットを返します。他の情報も追加できます。

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

あなたのクライアント側/ Javascriptでは、この情報を解析し、それに応じて画像を読み込み、処理中に必要な処理を行います。

0

あなたはこのような何か行うことができます。

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?

関連する問題