如何获得所选文件的完整path改变使用javascript,jquery-ajax的<input type ='file'>?
如何在使用<input type='file'>
select文件时获取文件的完整path<input type='file'>
<input type="file" id="fileUpload"> <script type="text/javascript"> function getFilePath(){ $('input[type=file]').change(function () { var filePath=$('#fileUpload').val(); }); } </script>
但是filePath var only name
包含选定文件的only name
,而不包含full path
。
我在网上search,但似乎出于安全原因,浏览器(FF,铬)只是给文件的名称。
有没有其他的方式来获得所选文件的完整path?
出于安全原因,浏览器不允许这样做,即浏览器中的JavaScript无法访问文件系统,但是使用HTML5 File API,只有Firefox提供了mozFullPath
属性,但如果尝试获取该值,则会返回一个空string:
$('input[type=file]').change(function () { console.log(this.files[0].mozFullPath); });
所以,不要浪费你的时间。
编辑:如果您需要文件path来读取文件,则可以使用FileReader API。 这是一个关于SO的相关问题: 在上传之前预览图像。
尝试这个:
它会给你一个临时path,而不是准确的path,如果你想显示select的图像,可以使用这个脚本,如在这个jsfiddle例子(尝试通过selectng图像以及其他文件): –
的jsfiddle
这是代码: –
HTML: –
<input type="file" id="i_file" value=""> <input type="button" id="i_submit" value="Submit"> <br> <img src="" width="200" style="display:none;" /> <br> <div id="disp_tmp_path"></div>
JS: –
$('#i_file').change( function(event) { var tmppath = URL.createObjectURL(event.target.files[0]); $("img").fadeIn("fast").attr('src',URL.createObjectURL(event.target.files[0])); $("#disp_tmp_path").html("Temporary Path(Copy it and try pasting it in browser address bar) --> <strong>["+tmppath+"]</strong>"); });
它不是你正在寻找的,但可能是它可以帮助你的地方。
你不能这样做 – 浏览器不会允许这个,因为安全问题。
当通过使用input type = file对象select文件时,value属性的值取决于用于显示Web页面的安全区段的“将文件上载到服务器时包含本地目录path”的值包含input对象。
仅当启用此设置时才会返回所选文件的完全限定文件名。 当设置被禁用时,Internet Explorer 8用stringC:\ fakepath \replace本地驱动器和目录path,以防止不适当的信息泄露。
和别的
你错过了);
这个变化事件函数的结尾。
也不要创build更改事件的function,而是像下面那样使用它,
<script type="text/javascript"> $(function() { $('#fileUpload').on('change',function () { var filePath = $(this).val(); console.log(filePath); }); }); </script>
你的意思是?
$('#i_file').change( function(event) { var tmppath = URL.createObjectURL(event.target.files[0]); $("img").fadeIn("fast").attr('src',tmppath); });
你不能。 安全阻止你知道客户端计算机的文件系统的任何事情 – 甚至可能没有一个! 它可能是一台MAC,一台个人电脑,一台平板电脑或一台能上网的冰箱 – 你不知道,不知道,也不会知道。 让你有完整的path可以给你一些有关客户端的信息 – 特别是如果它是一个networking驱动器例如。
事实上,你可以在特定的条件下得到它,但是它需要一个ActiveX控件,并且在99.99%的情况下不能工作。
无论如何,你不能用它来将文件恢复到原来的位置(因为你完全不能控制下载的存储位置,或者即使它们被存储),所以在实践中它对你来说并不是很有用。
您可以使用以下代码获取上传文件的工作本地URL:
<script type="text/javascript"> var path = (window.URL || window.webkitURL).createObjectURL(file); console.log('path', path); </script>
你不应该这样做….我想在最新的浏览器尝试它是无用的(从我所知道的)..所有最新的浏览器另一方面,将不会允许这….
一些其他的链接,你可以通过,find一个解决方法,如获取价值的服务器端,但不是在客户端(JavaScript)
从文件input使用jQuery的完整path
如何在Firefox 3中从HTMLinput表单获取文件path
你可以,如果上传整个文件夹是你的select
<input type="file" webkitdirectory directory multiple/>
更改事件将包含:
.target.files[...].webkitRelativePath: "FOLDER/FILE.ext"