По какой причине document.getElementById работает, а jquery - нет?

0

Этот вопрос может показаться элементарным для некоторых, но я не могу обдумать его. Я работаю над загрузкой файла XMLHttpRequest Ajax. первым шагом является выбор элемента fileUpload, который находится на моей странице, и по какой-то причине javascript работает, но не выполняет запрос, здесь следующие две строки:

var fileInput = $('#the-file'); //doesn't work
var fileInput = document.getElementById('the-file'); //works

Должен ли я указывать метод после селектора jquery или sth? Потому что я не понимаю, почему еще это не сработает, разве это не тот же самый код?

Я добавил файл jquery.js сверху (у меня много строк jquery, работающих над другими частями моего файла, поэтому это не может быть проблемой.) И документ готов. Я получил его, чтобы работать, но я задаюсь вопросом о причине этого.

редактировать

Не работает я имею в виду, что с селектором jquery я получаю "undefined" в журнале консоли, но с javascript я получаю всю необходимую мне информацию о файле.

  • 0
    во-первых, готова ли переменная в документе? Во-вторых, какую версию JQuery вы используете? В-третьих, загружается ли идентификатор после страницы, то есть через ajax?
  • 0
    @LiamSorsby: если работает чистая версия JavaScript, отсутствие вызова $(document).ready здесь не проблема.
Показать ещё 14 комментариев
Теги:

2 ответа

2
Лучший ответ

Проблема в том, что объект jQuery является оболочкой для фактического объекта DOM, который в этом случае является элементом HTML <input> который имеет file типа. Только объект DOM имеет свойство files, а не объект jQuery. Вы можете получить доступ к элементам DOM, на которые ссылаются, используя числовые индексы, которые будут только 0 в этой ситуации. Следовательно, это решение:

var fileInput = $('#the-file');
fileInput.files[0]; // TypeError: cannot read property '0' of undefined
fileInput[0].files[0]; // works

Конечно, способ jQuery сделать это будет использовать функцию prop(), которая получает свойство первого объекта DOM в объекте jQuery:

fileInput.prop('files')[0];
Поделиться
  • 1
    Это не совсем так, объект jQuery является просто оболочкой и также имеет свойство files , но вам нужно обращаться к нему, как к любому свойству в jQuery, с помощью prop() -> jsfiddle.net/t4PyB
  • 0
    @adeneo: правда - я не часто использую jQuery, это более "jQuery" способ сделать это.
1

Учитывая, что я не знаю, что вы подразумеваете под "не работает", я бы предположил, что его, потому что все, что использует fileInput, хочет элемент DOM, а не объект jquery. Попробуй это:

var fileInput = $('#the-file')[0];
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню