Как захватить имя файла из файла ввода с помощью jQuery?

Question

У меня есть форма с контролем ввода файлов:

<input type="file" onclick="this.blur()" name="descFile" />

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

Есть ли способ с помощью Javascript каким-то образом захватить событие "select" из файла и отобразить его жирным шрифтом под файлом?

Answer 1

$('input[name="descFile"]').change(function(){
   var filename = $(this).val();
   $('<label>Filename selected: '+ filename +'</label>').insertAfter($(this));
});

Не забудьте положить его внутрь или аналогично:

$(function(){ });

Answer 2

Это можно сделать вот так

$('input[type=file]').val()

В любом случае, я предлагаю использовать имя или атрибут ID для выбора ввода. А с событием это должно выглядеть так:

$('input[type=file]').change(function(e){
  $in=$(this);
  $in.next().html($in.val());
});

Answer 3

Это атрибут значения вашего тега ввода, если я понимаю ваш вопрос.

$('#file_attach').change(function(){

        path=$(this).attr('value');
        start = path.lastIndexOf(".");
        alert("extention: "+start);
});