如何從HTML表單文件類型在模式窗口中打開圖像

Question

從表單文件輸入中選擇圖像時，如何在模式彈出窗口中打開圖像？

<input type="file" class="form-control">

Answer 1

您可以從輸入字段獲取Base64，然后將其附加到模態內的<img>元素。 在下面的鏈接中查找詳細信息。

FileReader.readAsDataURL（）

Answer 2

您可以使用fancybox，但是如果您使用base64編碼，則必須為圖像設置一些設置...就像這樣：

      <script type="text/javascript">
  $(document).ready(function () {
      $('.fancybox-cs').fancybox({
         type        : 'image'
      });
  });
  </script>