Лучший способ показать предварительный просмотр изображений перед загрузкой в ​​rails & carrierwave

Я использовал рельсы в течение последних нескольких дней и хотел узнать, какой лучший способ показать предварительный просмотр изображений перед загрузкой в ​​рельсы и несущую.

Я столкнулся с несколькими вариантами, например, используя загрузку файла plupload или jquery или с помощью функции uploadify.

Ответы

Ответ 1

Если вам нужно только предварительный просмотр изображения в форме перед загрузкой, вы (как я) увидим, что плагин JQuery Upload просто слишком сложный и не так прост в запуске (я смог просмотреть предварительный просмотр, но тогда я не удалось загрузить изображение).

http://saravani.wordpress.com/2012/03/14/preview-of-an-image-before-it-is-uploaded/

Это простой и быстрый код.

Я помещаю код здесь на всякий случай, когда источник умирает:

Script:

    <!-- Assume jQuery is loaded -->
    <script>
      function readURL(input) {
        if (input.files && input.files[0]) {
          var reader = new FileReader();

          reader.onload = function (e) {
            $('#img_prev')
              .attr('src', e.target.result)
              .width(150)
              .height(200);
          };

          reader.readAsDataURL(input.files[0]);
        }
      }
    </script>

В HTML:

    <!--[if IE]>
      <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    </head>
    <body>
      <input type='file' onchange="readURL(this);" />
      <img id="img_prev" src="#" alt="your image" />
    </body>

Ответ 2

Вы можете использовать плагин jQuery File Upload, который является полным решением, но если вам нужно что-то менее надежное, вы также можете попробовать использовать FileReader, например this, так что вы можете настроить функциональность, что вам нужно.

Ответ 3

В соответствии с документами image_cache отображается то, что вы загружаете.

<%= f.hidden_field :image_cache %>