Javascript-форум - Перенос содержимого из input file в textarea

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

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

- - Перенос содержимого из input file в textarea (https://javascript.ru/forum/misc/61079-perenos-soderzhimogo-iz-input-file-v-textarea.html)

Перенос содержимого из input file в textarea

Всем привет!

Дано:
стоят рядом два элемента, один textarea, другой input с type file. Нужно было сделать так, чтобы при выборе файла в input file содержимое (путь) появлялось в текстовом поле textarea. С горем пополам я это сделала (да, я еще новичок):

html:
<textarea type="text" placeholder="Загрузите изображение" id="picture"></textarea>
<input type="file" onchange="dwnlFn();" id="dwnl">

javascript:
function dwnlFn() {
document.getElementById('picture').innerHTML = document.getElementById('dwnl').value.replace(/.+[\\\/]/, "");
};

Такой вариант работает, но судя по всему только один раз:
- если прежде чем нажать на input и загрузить файл, написать что-то в строке, то при дальнейшей загрузки файла написанный текст не изменится на путь;
- если файл-таки загрузили и появилась строчка пути, но нам ее надо стереть и загрузить другой файл, то путь уже другого загруженного файла не появится.

Надо написать какую-то функцию? через if? не могу сообразить с этими формами, как это все лучше сделать. Если есть идеи - поделитесь :) Заранее спасибо!

<textarea type="text" placeholder="Загрузите изображение" id="picture"></textarea>
        <input type="file" onchange="dwnlFn();" id="dwnl">
	    <script>
		
		function dwnlFn() {
			document.getElementById('picture').value =  document.getElementById('dwnl').value.replace(/.+[\\\/]/, "");
		};		
	</script>

Цитата:

Сообщение от kds2108

чтобы при выборе файла в input file содержимое (путь) появлялось в текстовом поле textarea.

А с чего вы взяли, что браузер вместо имени файла отдаст полный путь? Путь браузер не покажет, такое можно получить в IE, если добавить в доверенные. Путь на клиенте не отображается и не передается на сервер в целях безопасности.

мне и не нужен путь как таковой, я удалила часть строки C:\fakepath в коде. Достаточно чтобы просто имя файла отображалось и не один раз, а каждый раз, если пользователь захочет стереть-снова загрузить.

destus,
все так просто, спасибо ))

Цитата:

Сообщение от kds2108

мне и не нужен путь как таковой, я удалила часть строки C:\fakepath в коде.

Этого в свойстве value и так не будет, так что и удалять не требуется. А имя файла будет изменяться и без участия пользователя, другое дело, если речь идет о костомизация поля ввода и надо самому беспокоится об этом, но опять таки нужно оперировать с value без всяких операций над ним.

laimas,
в хроме путь отображается именно с fakepath.
Я не знаю, что такое кастомизация поля ввода. У меня была проблема, она решилась, разве она как-то неправильно решилась? все работает

Да, так и есть, кроме FF в пределах локального все равно отдают fakepath. Значит подзабыл я сей момент, ибо давно с этим не заморачивался, так как более часто теперь это files[index].name. Глупее всего выглядит в IE, показывая при этом в самом поле file полный путь.