<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
Mozilla 给了我：
test.csv
但我想要本地完全限定的文件路径。如何解决这个问题？
如果这是由于浏览器安全问题，那么执行此操作的替代方法应该是什么？
某些浏览器具有安全功能，可防止 JavaScript 了解您文件的本地完整路径。这是有道理的 - 作为客户端，您不希望服务器知道您本地机器的文件系统。如果所有浏览器都这样做就好了。
用
document.getElementById("file-id").files[0].name;
代替
document.getElementById('file-id').value
我在输入onchange事件上使用对象 FileReader作为您的输入文件类型！此示例使用 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;
}
如果您转到 Internet Explorer、工具、Internet 选项、安全性、自定义，找到“将文件上传到服务器时包括本地目录路径”（这是一段相当长的路），然后单击“启用”。这将工作
我很高兴浏览器关心将我们从侵入性脚本等中拯救出来。我不满意 IE 在浏览器中放入一些东西，使简单的样式修复看起来像黑客攻击！
我使用了 <span> 来表示文件输入，以便我可以将适当的样式应用于 <div> 而不是 <input>（再次，因为 IE）。现在，由于这个 IE 想要向用户展示一个路径，该路径的值可以保证让他们保持警惕并且最不担心（如果不是完全吓跑他们？！）...更多 IE-CRAP！
无论如何，感谢在此处发布解释的人：IE 浏览器安全性：将“fakepath”附加到 input[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);