プラグイン「Upload Thumbs」で画像をプレビューする

    <!-- このサンプルで使うプラグイン（jQuery 本体のあとに読み込む） -->
    <script src="../js/jquery.upload_thumbs.js"></script>

<h3>画像を1枚選ぶ</h3>
<form action="data.php" method="post" enctype="multipart/form-data">
  <table class="thumb-form">
    <tr><th>テキスト</th><th>画像（1枚）</th></tr>
    <tr>
      <td><input type="text" name="text[]"></td>
      <td><label><input type="file" name="img[]" accept="image/*"></label></td>
    </tr>
  </table>
  <input type="submit" class="btn btn-default" name="send" value="送信">
</form>

<hr>

<h3>画像を複数枚選ぶ</h3>
<form action="data.php" method="post" enctype="multipart/form-data">
  <table class="thumb-form">
    <tr><th>テキスト</th><th>画像（複数可）</th></tr>
    <tr>
      <td><input type="text" name="text[]"></td>
      <td><label><input type="file" name="img[]" accept="image/*" multiple></label></td>
    </tr>
  </table>
  <input type="submit" class="btn btn-default" name="send" value="送信">
</form>

<script>
$(function() {
  // ページ内のすべての画像入力欄に、プレビュー機能を付ける
  $('form input:file').uploadThumbs({
    position : 0,      // 0 = 入力欄の「前」にサムネイルを入れる
    imgbreak : true    // サムネイルのあとで改行する
  });
});
</script>

[img] => Array
    (
        [name] => Array ( [0] => a.jpg  [1] => b.jpg  [2] => c.png )
        [type] => Array ( [0] => image/jpeg  [1] => image/jpeg  [2] => image/png )
        ...
    )

<h3>画像（$_FILES['img']）</h3>
<?php $names = (array)($files['name'] ?? []); ?>
<p>受け取ったファイルは <strong><?= count($names) ?> 個</strong>です。</p>
<table class="table table-striped">
  <tr><th>i</th><th>ファイル名 (name)</th><th>種類 (type)</th><th>サイズ (size)</th><th>error</th></tr>
<?php foreach ($names as $i => $name): ?>
  <tr>
    <td><?= h($i) ?></td>
    <td><?= h($name) ?></td>
    <td><?= h($files['type'][$i] ?? '') ?></td>
    <td><?= h(number_format((int)($files['size'][$i] ?? 0))) ?> バイト</td>
    <td><?= h($files['error'][$i] ?? '') ?></td>
  </tr>
<?php endforeach; ?>
</table>