Javascript-форум - как получить имя файла при загрузке его

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - как получить имя файла при загрузке его (https://javascript.ru/forum/misc/57211-kak-poluchit-imya-fajjla-pri-zagruzke-ego.html)

как получить имя файла при загрузке его

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

это возможно?

Имя пожалуйста, а вот путь браузеры "не выдают".

возможно
посмотри e.target.files возвращаемый input[file] на событии change
а потом преобразуй его в урл, примерно так:

var URL = window.webkitURL || window.URL;
var url = URL.createObjectURL(e.target.files[0])

естественно это будет ссылка на локальный файл, после загрузки подменишь его ссылкой на сервер

решение найдено:

<input id="выбор_файла" type="file" accept="image/*" onchange="функция1(this.files)">

#выбор_файла {display:none;}

var функция1=function(files)
{
var file = files[0];
alert(file.name); //имя файла
alert(file.size); //размер файла
}

кнопка_загрузки.onclick = function()
{
выбор_файла.click(); //имитация нажатия скрытой кнопки "выбор_файла"
}

- недостаток метода в том что надо создавать инпут который приходится скрывать

вопрос - как без инпута сделать то же самое

однако опять засада - не могу получить имя файла и вписать его в красную кнопку:

<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title></title>


<style type="text/css" id="">


#файл_картинки {
	display:flex;
	width: 74px;
	height: 44px;
	border: 2px solid red;
}


</style>
<script type="text/javascript"> "use strict";

var получение_имени_картинки = function(files)
               	{
                  var file = files[0];
                  имя_файла_картинки = file.name;      
                };

var выбор_файла = function()
                {  
                   выбор_файла_картинки.click();
                   файл_картинки.textContent = имя_файла_картинки;
                };


var имя_файла_картинки;


</script> 
</head>
<body>

<span id='файл_картинки' class='кнопка_css'onclick='выбор_файла()'></span>

<input id="выбор_файла_картинки" class='скрытый' type="file" accept="image/*" onchange="получение_имени_картинки(this.files)">
       

</body>
</html>