js 获得上传文件框中路径的问题

最新推荐文章于 2024-05-14 11:41:31 发布
最新推荐文章于 2024-05-14 11:41:31 发布
阅读量3.3k 收藏
点赞数
分类专栏： js 文章标签： input javascript file firefox function ie
 在ie6中对于<input type="file" />通过obj.value是可以获取客户端选择文件的全路径的，但是到ie7就只能获取文件名，这对于onchange事件立即显示图片会有问题，可以用js方法解决

具体代码如下：

<html>
    <head>
        <title>get file input full path</title>
    <script language='javascript'>
        function getFullPath(obj)
        {
            if(obj)
            {
                //ie
                if (window.navigator.userAgent.indexOf("MSIE")>=1)
                {
                    obj.select();
                    return document.selection.createRange().text;
                }
                //firefox
                else if(window.navigator.userAgent.indexOf("Firefox")>=1)
                {
                    if(obj.files)
                    {
                        return obj.files.item(0).getAsDataURL();
                    }
                    return obj.value;
                }
                return obj.value;
            }
        }
    </script>
    </head>
    <body>
        <input type="file" οnchange="document.getElementById('img').src=getFullPath(this);" />
    <img id="img" />
    </body>
</html>
ynztpwl
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js获取上传文件的绝对路径实现方法
12-10
在html中 <input type="file" id="importFile" /> <input type="button" onclick="upload()"/>...如上面的代码，用文件上传对话框选择文件后，如果选择”D:\\temp\file\test.txt”文
JS获取input 【type=“file“】的物理路径，解决浏览器C:\fakepath\的问题
帝都的雁的博客
01-17 3万+
相信很多猿友一定遇到过上传文件时，发现文件路径被替换为 C:\fakepath\**** 这是由于浏览器的安全机制，input file的路径时被fakepath代替，隐藏了真实物理路径。 解决方法： 1、调整浏览器的浏览器安全设置（不推荐，也不合理）。 2、使用window.URL.createObjectURL() /** * 文件预览 */ var url = null...
解决firefox3.0，ie8 在上传文件时只能获得文件名，而不能获得文件路径的问题
鹏飞的专栏
01-09 2883
 解决firefox3.0，ie8 在上传文件时只能获得文件名，而不能获得文件路径的问题：    我们的目的是要获取到文件的全路径，包括文件地址和文件名。下面我们以(struts 1.x)为例讲解------------------------------------------------------------------------------------ 1.jsp页面         
前端使用原生JS怎么上传本地路径的文件到后端【附源码】
最新发布
无法自律的人的博客
05-14 876
根据前端文本的本地路径地址进行文件上传后端
Linux学习笔记-shell脚本拼接文件并排序
weixin_45030158的博客
09-27 2775
shell实现两个文件的拼接 在实际的数据处理中，需要将多个文件写到同一个文件中，或者实现两个文件的拼接操作，这时候可以采用如下代码： cat inputFileName1 > outputFileName cat inputFileName2 >> outputFileName 第一行的目的是将输入文件1输出到输出文件中，第二行是将输入文件二直接添加在输出文件的尾部。随后如果仍有后续文件的拼接可继续使用第二行： cat inputFileNamen >> outputFil
vue+elementUi+el-upload上传文件、获取本机文件路径
Passerby_OK的博客
08-03 2万+
文件上传获取本地文件路径
js根据本地文件路径上传文件（流上传）
nobody
02-18 1万+
最近使用vue做了个项目，把本地指定url下的png图片上传。 废话不多说，直接上代码： var fs = require('fs') //需要引入nodejs中的文件操作部分 var http = require('http') //需要引入nodejs中http请求部分 /** * 实际封装接口的入口 * @param {*} options 请求的配置项 * @param {*} path 文件上传路径 * @param {*} id 文件上传参数（id） * @param {*} n
如何使用JS获取IE上传文件路径(IE7,8)
10-27
在Web开发中，尤其是在使用JavaScript处理文件上传时，有时我们需要获取用户选择的文件路径。然而，出于安全考虑，现代浏览器（如Chrome、Firefox）不再允许JavaScript访问完整的文件路径，仅提供文件名。但在较旧的...
js弹出窗口 + 获取上传文件全路径
04-05
本文将深入探讨"js弹出窗口 + 获取上传文件全路径"这一主题，这两个知识点是JavaScript在交互式用户界面设计中的关键部分。 首先，让我们来讨论"js弹出窗口"。在网页开发中，弹出窗口通常用于显示警告信息、确认...
js弹出窗口 获取上传文件全路径
03-26
在本篇中，我们将深入探讨如何使用JS实现弹出窗口以及获取上传文件的全路径。 首先，我们来讨论如何使用JS创建一个弹出窗口。通常，我们会结合HTML和CSS来实现。在HTML中，我们可以创建一个隐藏的`<form>`元素，...
SpringMVC框架 |文件下载与文件上传
01-08
假设要下载项目中的jQuery-3.4.1.js文件。 @RequestMapping(/download) public ResponseEntity download(HttpServletRequest request) throws Exception { // 1.得到要下载文件的真实路径 ServletContext ...
JS、JSP不能正确获取上传文件路径问题
lizhengyu617的专栏
11-20 1418
问题1：在进行页面开发时，我们经常会要获取文件的路径，但是有时会出现文件路径错误的问题， JSP代码： JS代码： 此时，会出现如下问题：文件路径变为：C：\fakepath\*.txt 产生原因是IE的安全性设置造成的。   问题2：   按上述代码进行操作，可能会出现错误：拒绝访问 在IE9下，如果file控件获得焦点，则document.selection.
IE8中JS获得文件上传控件的路径不对
xiuxian1的专栏
01-07 104
IE8中JS获得文件上传控件的路径不对,为:C:\fakepath\ 原来要修改: 工具 -> Internet选项 -> 安全 -> 自定义级别 -> 将本地文件上载至服务器时包含本地目录路径，选中启用即可...
js获取文件上传路径（解决出现fakepath的问题）
littlebearGreat——宁静致远
08-11 2万+
上传文件时，有时候需要获取文件路径，但是浏览器安全机制，使得路径被fakepath代替，获取不到 下面的代码解决这个问题，支持Chrome，其它浏览器没测试，用的时候注意 代码 上传file属性 $(function(){ $('.upload').change(function(){ var oFReader = new FileReader()
js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径
热门推荐
i2295301的博客
08-14 3万+
分为两部分，自己去判断浏览器的类型，然后调用不同函数，一定要引入jQuery，上面是我的Jquery的路径 在IE低版本中可以直接获得文件路径，不过在高版本和firefox和chrome中是不允许的。那是个漏洞 这样就能实现不用上传就可以实现图片的实时预览了 1.IE内核的部分，IE10 没问题，别的没试， [html] view plain
使用js获取上传文件的路径？
weixin_34411563的博客
01-31 2万+
由于浏览器的安全限制，<input type="file">通过js的onchange事件获取上传文件的路径时，返回的是C:fakepath文件名，隐藏了真实的物理路径，可以使用window.URL.createObjectURL()返回一个Blob对象，Blob对象就是二进制数据，它是一个包含有只读原始数据的类文件对象组件u...
关于js获取上传文件的完整路径问题？
mrdu_somefun的博客
11-14 4742
file是一种特殊的input，不能被赋值，也不能被javascript取值，只能随表单提交，而且随表单提交的也是file路径所指向的文件本身。 这是浏览器安全原因所限制的，如果可以取值和赋值的话，那么javascript就可以随意获取你电脑上的文件了，这是非常危险的
springmvc框架上传文件,相对路径储存到mysql数据库
06-01
在SpringMVC框架中上传文件并将相对路径存储到MySQL数据库可以按照以下步骤进行操作： 1. 在前端页面中添加文件上传功能，可以使用HTML的input标签或者第三方插件如Dropzone.js等。 2. 在后端Controller中添加处理文件上传的方法，可以使用@RequestParam注解获取上传的文件。 3. 在处理文件上传的方法中，将上传的文件保存到服务器本地的指定目录下，可以使用File类的API。 4. 将保存在服务器本地的文件的相对路径（相对于Web应用根目录）存储到MySQL数据库中的指定表和字段中，可以使用Spring JDBC Template或者Mybatis等持久化框架。 以下是一个大概的示例代码： 前端HTML页面： ``` <form action="/upload" method="post" enctype="multipart/form-data"> <input type="file" name="file"/> <input type="submit" value="Upload"/> </form> ``` 后端Controller： ``` @Controller public class FileUploadController { @RequestMapping(value = "/upload", method = RequestMethod.POST) public String uploadFile(@RequestParam("file") MultipartFile file) throws IOException { // 保存上传的文件到服务器本地目录下 String filePath = "/uploads/" + file.getOriginalFilename(); File dest = new File(filePath); file.transferTo(dest); // 将文件相对路径存储到MySQL数据库中 String sql = "INSERT INTO file_table (file_path) VALUES (?)"; jdbcTemplate.update(sql, filePath); return "upload_success"; } @Autowired private JdbcTemplate jdbcTemplate; } ``` 其中，`/uploads/`是服务器本地存储文件的相对路径，`file_table`是MySQL数据库中的表名，`file_path`是存储文件相对路径的字段名。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值