предварительный просмотр изображения перед загрузкой - что проверяет эта строка кода?

#javascript

Вопрос:

Итак, я искал способ предварительного просмотра изображения перед его загрузкой и наткнулся на этот метод:

 <script type="text/javascript">
        function readURL(input) {
            if (input.files amp;amp; input.files[0]) {
                var reader = new FileReader();

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

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

<body>
    <form id="form1" runat="server">
        <input type='file' onchange="readURL(this);" />
        <img id="blah" src="#" alt="your image" />
    </form>
</body>

Это отлично работает, но есть кое-что, чего я не понимаю.

Что делает, если (ввод.файлы amp;amp; ввод.файлы [0]) действительно делают?

Я знаю этот ввод.files возвращает объект FileList, который позволяет вам получить доступ к списку файлов, выбранных с помощью <input type='file'> элемента и этого ввода.files[0] возвращает первый файл в списке файлов узла, но, похоже, я не могу понять, что проверяет эта строка кода…

Спасибо!

1. Проверяется, что у входного объекта есть files свойство и что у него есть файл в [0] первом индексе.

2. Хорошо, теперь я понимаю, что делает эта строка кода, и спасибо за ответ @adeneo, но я все еще немного сбит с толку… Зачем ему нужно проверять, что входной объект имеет свойство files? Я имею в виду, что метод readURL вызывается, когда изменяется состояние ввода типа file, так что входные данные всегда будут иметь свойство files …

Ответ №1:

 if(input.files amp;amp; input.files[0])

Проверяет, содержит ли входной объект элемент с именем files using, И проверяет, является ли объект files массивом, в котором есть хотя бы один элемент

1. спасибо за ответ @Husman, теперь я понимаю, что делает эта строка кода, но теперь я не понимаю, зачем он это делает? Метод readURL вызывается при изменении состояния ввода типа file, не означает ли это, что на входе всегда будет элемент с именем fils?

2. onChange сообщает обо всех изменениях, даже если файл был выбран или отменен выбор. Рекомендуется проверять, имеет ли элемент значение null (поскольку браузер или настройки безопасности могут запрещать определенные файлы или размер файла. Также можете ли вы поддержать ответ, если он был полезен. Спасибо.

3. Да, я думаю, теперь я понял, еще раз спасибо. Боюсь, я не могу поддержать ответ, в нем говорится, что мне нужно как минимум 15 очков репутации, чтобы сделать это, у меня есть только 9….