предварительный просмотр изображения перед отправкой формы

Question

У меня есть ImageField в моей форме.Есть ли способ показать выбранный файл перед отправкой формы?Может быть, это возможно в jQuery?

Я прочитал, что могу как-то получить доступ к этим файлам с помощью request.FILES, но я думаю, что он будет пуст, прежде чем я отправлю форму.

Answer 1

попробуйте это.

<script type="text/javascript">


        function upload_img(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    $('#img_id').attr('src', e.target.result);
                }

                reader.readAsDataURL(input.files[0]);
            }
        }

    </script>

И HTML ниже.

Спасибо.

    <form id="form_img">
        <input type='file' onchange="upload_img(this);" />
        <img id="img_id" src="#" alt="your image" />
    </form>

Это может быть полезно для вас.