Изменить текст метки ввода файла на имя файла

Я пытаюсь изменить текст метки для поля ввода файла на имя файла, однако в консоли появляется следующая ошибка:

Uncaught TypeError: Cannot read property 'files' of undefined

Вот HTML и JQuery:

<div class = "custom-file">
    <label class = "custom-file-label text-left" for = "customFile" id = "file">Choose file</label>
    <input type = "file" class = "custom-file-input" id = "customFile">
</div>


<script type = "text/javascript">
    $('#customFile').change(function() {
      var i = $(this).prev('label').clone();
      var file = $('customFile')[0].files[0].name;
      $(this).prev('label').text(file);
    });
</script>

Я все еще изучаю JQuery, поэтому приветствую любую помощь!

jquery html

25.03.2018 03:11

Как конвертировать HTML в PDF с помощью jsPDF

В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.

1 512

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я думаю, вы просто забыли # для customFile в селекторе

 var file = $('#customFile')[0].files[0].name;

здесь полный код

 $('#customFile').on("change",function() {
      console.info("change fire");
     var i = $(this).prev('label').clone();
      var file = $('#customFile')[0].files[0].name;
   console.info(file);
      $(this).prev('label').text(file);

    });

https://codepen.io/jehadja/pen/pLrYwq?editors=1111

Спасибо! Не буду врать, я потратил несколько минут, пытаясь понять эту простую вещь.

— 25.03.2018 03:24

25.03.2018 03:22