Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.02.2016, 13:24
Новичок на форуме
Отправить личное сообщение для kds2108 Посмотреть профиль Найти все сообщения от kds2108
 
Регистрация: 03.02.2016
Сообщений: 4

Перенос содержимого из 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? не могу сообразить с этими формами, как это все лучше сделать. Если есть идеи - поделитесь Заранее спасибо!

Последний раз редактировалось kds2108, 03.02.2016 в 13:26.
Ответить с цитированием
  #2 (permalink)  
Старый 03.02.2016, 14:40
Аватар для destus
Профессор
Отправить личное сообщение для destus Посмотреть профиль Найти все сообщения от destus
 
Регистрация: 18.05.2011
Сообщений: 1,207

<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>
Ответить с цитированием
  #3 (permalink)  
Старый 03.02.2016, 15:16
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от kds2108
чтобы при выборе файла в input file содержимое (путь) появлялось в текстовом поле textarea.
А с чего вы взяли, что браузер вместо имени файла отдаст полный путь? Путь браузер не покажет, такое можно получить в IE, если добавить в доверенные. Путь на клиенте не отображается и не передается на сервер в целях безопасности.
Ответить с цитированием
  #4 (permalink)  
Старый 03.02.2016, 16:19
Новичок на форуме
Отправить личное сообщение для kds2108 Посмотреть профиль Найти все сообщения от kds2108
 
Регистрация: 03.02.2016
Сообщений: 4

мне и не нужен путь как таковой, я удалила часть строки C:\fakepath в коде. Достаточно чтобы просто имя файла отображалось и не один раз, а каждый раз, если пользователь захочет стереть-снова загрузить.
Ответить с цитированием
  #5 (permalink)  
Старый 03.02.2016, 16:27
Новичок на форуме
Отправить личное сообщение для kds2108 Посмотреть профиль Найти все сообщения от kds2108
 
Регистрация: 03.02.2016
Сообщений: 4

destus,
все так просто, спасибо ))
Ответить с цитированием
  #6 (permalink)  
Старый 03.02.2016, 16:41
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от kds2108
мне и не нужен путь как таковой, я удалила часть строки C:\fakepath в коде.
Этого в свойстве value и так не будет, так что и удалять не требуется. А имя файла будет изменяться и без участия пользователя, другое дело, если речь идет о костомизация поля ввода и надо самому беспокоится об этом, но опять таки нужно оперировать с value без всяких операций над ним.
Ответить с цитированием
  #7 (permalink)  
Старый 04.02.2016, 16:31
Новичок на форуме
Отправить личное сообщение для kds2108 Посмотреть профиль Найти все сообщения от kds2108
 
Регистрация: 03.02.2016
Сообщений: 4

laimas,
в хроме путь отображается именно с fakepath.
Я не знаю, что такое кастомизация поля ввода. У меня была проблема, она решилась, разве она как-то неправильно решилась? все работает
Ответить с цитированием
  #8 (permalink)  
Старый 04.02.2016, 17:19
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

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



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Пустой file input суссесфул или не successful? kostyanet Элементы интерфейса 1 08.01.2015 17:56
Передача значения из textarea в input TuxShot Events/DOM/Window 6 16.02.2014 23:27
как прописать условия для полей input и textarea Nailya Общие вопросы Javascript 12 06.06.2013 16:48
При добавлении DOCTYPE "плывут" размеры input type=text Demath (X)HTML/CSS 4 08.07.2012 19:27
Обработка нескольких file input Temlekur Работа 8 21.01.2010 18:30