<input type="file" id="file-id" name="file_name" onchange="theimage();">
Это моя кнопка загрузки.
<input type="text" name="file_path" id="file-path">
Это текстовое поле, в котором я должен показать полный путь к файлу.
function theimage(){
var filename = document.getElementById('file-id').value;
document.getElementById('file-path').value = filename;
alert(filename);
}
Это JavaScript, который решает мою проблему. Но в значении предупреждения дает мне
C:\fakepath\test.csv
и Мозилла дает мне:
test.csv
Но я хочу местный полный путь к файлу. Как решить эту проблему?
Если это связано с проблемой безопасности браузера, каким должен быть альтернативный способ сделать это?
Некоторые браузеры имеют функцию безопасности, которая не позволяет JavaScript знать локальный полный путь вашего файла. Это имеет смысл — как клиент, вы не хотите, чтобы сервер знал файловую систему вашего локального компьютера. Было бы хорошо, если бы все браузеры сделали это.
использование
document.getElementById("file-id").files[0].name;
вместо
document.getElementById('file-id').value
Если вы зайдете в Internet Explorer, Сервис, Интернет, Безопасность, Пользовательский, найдите «Включить путь к локальному каталогу при загрузке файлов на сервер» (это довольно далеко) и нажмите «Включить». Это будет работать
Я использую объект FileReader на входе onchange
событие для вашего типа входного файла! В этом примере используется функция readAsDataURL, и по этой причине у вас должен быть тег. Объект FileReader также имеет readAsBinaryString для получения двоичных данных, которые впоследствии можно использовать для создания того же файла на вашем сервере.
Пример:
var input = document.getElementById("inputFile");
var fReader = new FileReader();
fReader.readAsDataURL(input.files[0]);
fReader.onloadend = function(event){
var img = document.getElementById("yourImgTag");
img.src = event.target.result;
}
Я рад, что браузеры заботятся о том, чтобы спасти нас от навязчивых сценариев и тому подобного. Я не доволен тем, что IE помещает в браузер что-то, что делает простое исправление стиля похожим на хак-атаку!
Я использовал < span> для представления файла-ввода, чтобы я мог применить соответствующий стиль к < div> вместо < вход> (еще раз, из-за IE). Теперь из-за этого IE хочет показать пользователю путь со значением, которое гарантированно защитит его и в крайнем случае (если не полностью отпугнет?!) … БОЛЬШЕ IE-CRAP!
В любом случае, спасибо тем, кто разместил объяснение здесь: IE Browser Security: добавление «fakepath» к пути к файлу во входных данных [type = «file»], Я собрал небольшой верхний фиксатор …
Приведенный ниже код выполняет две вещи: он исправляет ошибку IE8, из-за которой событие onChange не срабатывает, пока в поле загрузки не отображается onBlur, и обновляет элемент с очищенным путем к файлу, который не пугает пользователя.
// self-calling lambda to for jQuery shorthand "$" namespace
(function($){
// document onReady wrapper
$().ready(function(){
// check for the nefarious IE
if($.browser.msie) {
// capture the file input fields
var fileInput = $('input[type="file"]');
// add presentational <span> tags "underneath" all file input fields for styling
fileInput.after(
$(document.createElement('span')).addClass('file-underlay')
);
// bind onClick to get the file-path and update the style <div>
fileInput.click(function(){
// need to capture $(this) because setTimeout() is on the
// Window keyword 'this' changes context in it
var fileContext = $(this);
// capture the timer as well as set setTimeout()
// we use setTimeout() because IE pauses timers when a file dialog opens
// in this manner we give ourselves a "pseudo-onChange" handler
var ieBugTimeout = setTimeout(function(){
// set vars
var filePath = fileContext.val(),
fileUnderlay = fileContext.siblings('.file-underlay');
// check for IE's lovely security speil
if(filePath.match(/fakepath/)) {
// update the file-path text using case-insensitive regex
filePath = filePath.replace(/C:\\fakepath\\/i, '');
}
// update the text in the file-underlay <span>
fileUnderlay.text(filePath);
// clear the timer var
clearTimeout(ieBugTimeout);
}, 10);
});
}
});
})(jQuery);
Я столкнулся с той же проблемой. В IE8 это можно обойти, создав скрытый ввод после элемента управления вводом файла. Заполните это значением предыдущего брата. В IE9 это было исправлено.
Причиной, по которой я хотел узнать полный путь, было создание предварительного просмотра изображения javascript перед загрузкой. Теперь мне нужно загрузить файл, чтобы создать предварительный просмотр выбранного изображения.
Если вам действительно нужно отправить полный путь к загруженному файлу, вам, вероятно, придется использовать что-то вроде подписанного Java-апплета, поскольку нет способа получить эту информацию, если браузер не отправляет ее.
кажется, вы не можете найти полный путь в вашем локальном хосте с помощью js, но вы можете скрыть поддельный путь, чтобы просто показать имя файла. Используйте jQuery, чтобы получить файл с выбранным именем файла без пути