javascriptやjQueryで画像を書き換えても変わらない場合
2024/02/28
けっこう前に画像をアップロードしてリアルタイムにプレビューする機能を作った時に、ブラウザによっては同じ画像が表示されるという現象が発生していた。キャッシュが原因のようで画像URLにタイムスタンプを付与することで解決できた。以下に対応方法をメモ。
ソースコード
var timestamp = new Date().getTime();
$('#img-id').attr('src', $('#img-id').attr('src')+'?'+timestamp);
timestamp部分はJavaScriptで取得しているがjQueryの場合は以下でも取得できる。
var timestamp = jQuery.now();
リファレンス
https://api.jquery.com/jQuery.now/
PHPでタイムスタンプを付けたい場合
関連記事
-
-
フォームからアップロードした画像にPHPでロゴ画像(透かし)を追加する方法
フォームから送られてきた画像に対してサイトロゴみたいなロゴ画像を右下等、指定の位 ...
-
-
formのinput="file"でディレクトリを選択させ、ディレクトリ内のファイルを全てアップロードする方法
フォームで複数のファイルをアップロードしたい場合、input="file"を複数 ...
-
-
JavaScriptにて画像をフルスクリーン表示する方法
JavaScriptにて画像をクリックするとフルスクリーン表示させたかった。ただ ...
-
-
PHPで縦横どちらかが指定の長さを超えた場合、比率を保ったままリサイズ
PHPで縦横どちらかが指定の長さを超えた場合、 比率を保ったままリサイズしたかっ ...
-
-
JavaScriptにて電子書籍や漫画ビューア用のライブラリ「ToraViewer」の利用方法
電子書籍や漫画ビューア用を設置したい。条件としてはレスポンシブ対応していること。 ...