js获取file控件的完整路径（上传图片预览）
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript">
function fun()
{
alert();
}
function bao(str)
{
//alert(str);
//int n=Integer.parseInt(str);
var img="images/tx/";
img+=str;
img+=".gif";
img = "images/map.png";
//alert(img);
// 取得img节点
var imgNode=document.getElementById("picture"); // 修改img节点的src属性
imgNode.setAttribute("src",img); //oDiv.innerHTML="<img src=images/tx/2.gif width='80' height='80' border='1' />";
//不能改变图片，src不能使变量！
}
function readFileFirefox(fileBrowser) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
}
catch (e) {
alert('无法访问本地文件，由于浏览器安全设置。为了克服这一点，请按照下列步骤操作：(1)在地址栏输入"about:config";(2) 右键点击并选择 New->Boolean; (3) 输入"signed.applets.codebase_principal_support" （不含引号）作为一个新的首选项的名称;(4) 点击OK并试着重新加载文件');
return;
}
var fileName=fileBrowser.value; //这一步就能得到客户端完整路径。下面的是否判断的太复杂，还有下面得到ie的也很复杂。
var file = Components.classes["@mozilla.org/file/local;1"]
.createInstance(Components.interfaces.nsILocalFile);
try {
// Back slashes for windows
file.initWithPath( fileName.replace(/\//g, "\\\\") );
}
catch(e) {
if (e.result!=Components.results.NS_ERROR_FILE_UNRECOGNIZED_PATH) throw e;
alert("File '" + fileName + "' cannot be loaded: relative paths are not allowed. Please provide an absolute path to this file.");
return;
}
if ( file.exists() == false ) {
alert("File '" + fileName + "' not found.");
return;
}
return file.path;
}
//根据不同浏览器获取路径
function getpic(){
//判断浏览器
var Sys = {};
var ua = navigator.userAgent.toLowerCase();
var s;
(s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[] :
(s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[] :
(s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[] :
(s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[] :
(s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[] : ;
var file_url="";
if(Sys.ie<="6.0"){
//ie5.5,ie6.0
file_url = document.getElementById("file").value;
}else if(Sys.ie>="7.0"){
//ie7,ie8
var file = document.getElementById("file");
file.select();
file_url = document.selection.createRange().text;
}else if(Sys.firefox){
//fx
//file_url = document.getElementById("file").files[0].getAsDataURL();//获取的路径为FF识别的加密字符串
file_url = readFileFirefox(document.getElementById("file"));
}
alert(file_url);
img = file_url;
//alert(img);
// 取得img节点
var imgNode=document.getElementById("picture"); // 修改img节点的src属性
imgNode.setAttribute("src",img); }
</script>
<input type ="file" id = "file" onchange="getpic()" />
<img id="picture"/> </body>
</html>
<script type="text/javascript">
//FX获取文件路径方法
function readFileFirefox(fileBrowser) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
}
catch (e) {
alert('无法访问本地文件，由于浏览器安全设置。为了克服这一点，请按照下列步骤操作：(1)在地址栏输入"about:config";(2) 右键点击并选择 New->Boolean; (3) 输入"signed.applets.codebase_principal_support" （不含引号）作为一个新的首选项的名称;(4) 点击OK并试着重新加载文件');
return;
}
var fileName=fileBrowser.value; //这一步就能得到客户端完整路径。下面的是否判断的太复杂，还有下面得到ie的也很复杂。
var file = Components.classes["@mozilla.org/file/local;1"]
.createInstance(Components.interfaces.nsILocalFile);
try {
// Back slashes for windows
file.initWithPath( fileName.replace(/\//g, "\\\\") );
}
catch(e) {
if (e.result!=Components.results.NS_ERROR_FILE_UNRECOGNIZED_PATH) throw e;
alert("File '" + fileName + "' cannot be loaded: relative paths are not allowed. Please provide an absolute path to this file.");
return;
}
if ( file.exists() == false ) {
alert("File '" + fileName + "' not found.");
return;
}
return file.path;
}
//根据不同浏览器获取路径
function getvl(){
//判断浏览器
var Sys = {};
var ua = navigator.userAgent.toLowerCase();
var s;
(s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[] :
(s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[] :
(s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[] :
(s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[] :
(s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[] : ;
var file_url="";
if(Sys.ie<="6.0"){
//ie5.5,ie6.0
file_url = document.getElementById("file").value;
}else if(Sys.ie>="7.0"){
//ie7,ie8
var file = document.getElementById("file");
file.select();
file_url = document.selection.createRange().text;
}else if(Sys.firefox){
//fx
//file_url = document.getElementById("file").files[0].getAsDataURL();//获取的路径为FF识别的加密字符串
file_url = readFileFirefox(document.getElementById("file"));
}
//alert(file_url);
document.getElementById("text").innerHTML="获取文件域完整路径为："+file_url;
}
</script>
<h1>JS获取文件域完整路径的方法，兼容不同浏览器</h1>
<div id="text" style="color:#f00;"></div>
<input type="file" id="file" />
<input name="" type="button" value="获取" onClick="getvl();">
js获取file控件的完整路径（上传图片预览）的更多相关文章
- html file控件选择文件后立即预览 js实现
//上传图片后立即预览 file对象,图片容器id function showImg(fileObj,imgId) { var file=fileObj.files[0]; var r = new F ...
- IE9获取file控件的本地文件路径
最近发现,在IE9下,公司网站的本地图片预览都无法正常显示,经过测试发现,原因在于IE9下无法获取file控件的文件路径. 以前的代码如下: var strPic = fileImg.value; i ...
- 使用js获取checkbox控件在GridView中的第几行
这次的知识点是如何使用js获取checkbox控件所在的是第几行!!! 我们可以使用 JavaScript 中自带的 rowIndex 和 cellIndex 来获取行和列的键值 (从0开始) 这两个 ...
- 怎么清除file控件的文件路径
还记得上次做一个文件上传,后来测试告诉我说,如果我要是不选择文件了呢?该怎么办?我说:简单啊,做一个取消按钮不就完事了吗!然后我就想一个file空间做一个取消是多么简单的事,用js处理可是想怎么样就怎 ...
- JS获取用户控件中的子控件Id
用户控件 <asp:HiddenField ID="hfGradeId" runat="server" /> <asp:HiddenField ...
- JS 获取Button控件的提交类型
<script type="text/javascript"> <!--获取button控件的类型---> function isAuditOrCancel ...
- JS获取服务器端控件ID
很多时候我们需要在JS中对服务器端控件进行一些简单处理,但是这个时候没有必要回发到服务器,让服务器去处理,这个时候就又要用到JS了 那么怎么去获取这个服务器端控件呢?我们知道服务器最终返回到用户界面的 ...
- JS 获取FileUpload1控件地址
function openList() { //判断浏览器类型 var isIE = (document.all) ? true : false; ); ); ); var path = " ...
- Asp.Net 获取FileUpload控件的文件路径、文件名、扩展名
string fileNameNo = Path.GetFileName(FileUploadImg.PostedFile.FileName); //获取文件名和扩展名string Directory ...
随机推荐
- SeaJS：一个适用于 Web 浏览器端的模块加载器
什么是SeaJS?SeaJS是一款适用于Web浏览器端的模块加载器,它同时又与Node兼容.在SeaJS的世界里,一个文件就是一个模块,所有模块都遵循CMD(Common Module Definit ...
- hibernate框架学习第六天：QBC、分页查询、投影、数据加载策略、二级缓存
QBC查询 1.简单查询 Criteria c = s.createCriteria(TeacherModel.class); 2.获取查询结果 多条:list 单挑:uniqueResult 3.分 ...
- HDU 5377 (Exgcd + 原根）
转载自:大牛 知道一个定理了 a ^ x = y (mod p) ===>> logd(a) * x = logd(y) (mod O(p) ) d 为 p 的 原根, O ...
- selenium之css定位小结
前言 大部分人在使用selenium定位元素时,用的是xpath定位,因为xpath基本能解决定位的需求.css定位往往被忽略掉了,其实css定位也有它的价值,css定位更快,语法更简洁.这一篇css ...
- 解决ftp客户端连接验证报错Server sent passive reply with unroutable address. Using server address instead
最近在linux服务器安装vsftp服务.经过一轮设置,终于可以连接上了,用winSCP连接,刷新目录就提示这个错误. 解决办法: vim /etc/vsftpd.conf ,编辑配置文件,最后加上 ...
- iOS 上线过程中出现的问题总结
1: 因为使用后台播放音乐,在 info 里面添加 required background modes 的 key, 如果你的代码里面没有后套播放音频的功能, 不要添加 required back ...
- swift 学习- 11 -- 属性
// '属性'将值跟特定的类, 结构体或枚举关联, 存储属性常量或变量作为实例的一部分,而计算属性计算(不是存储) 一个值, 计算属性可以用于 类, 结构体, 枚举, 存储属性只能用于 类 和 结构体 ...
- Confluence 6 系统运行信息中的 JVM 内存使用情况
当前一个正在运行的 Confluence 6 实例的内存使用情况 https://www.cwiki.us/display/CONF6ZH/Viewing+System+Information
- Confluence 6 新安装配置数据库字符集编码
Confluence 和你的数据库必须配置使用相同的字符集. Confluence 使用 UTF-8 字符集编码,所以你的数据库也必须配置为使用 UTF-8 (或者与 UTF-8 相同的编码,例如在 ...
- js new一个函数和直接调用函数的区别
用new和调用一个函数的区别:如果函数返回值是一个值类型(Number.String.Boolen)时,new函数将会返回这个函数的实例对象,而如果这个函数的返回值是一个引用类型(Object.Arr ...