彩世界开奖app官网-彩世界平台官方网址(彩票平台)
做最好的网站
来自 彩世界平台官方网址 2019-11-28 05:46 的文章
当前位置: 彩世界开奖app官网 > 彩世界平台官方网址 > 正文

JS获取IE上传文件路径、后缀、大小、文件名代码

也就是说,移到对象的子对象上,也算onmouseout了。但这往往会达不到我们想要的预期效果。这是由于javascript自身的冒泡特性导致的(即在子元素上触发了事件,并冒泡到了父元素-堆栈后进先出算法)。今天在网上搜了一下,找了以下的解决办法。 在IE下解决问题很简单,用onMouseEnter、onMouseLeave来代替onMouseOver、onMouseOut就行了,他们的作用基本相同,但前者不会发生冒泡(如果用 jQuery的event事件,只要绑定mouseleave、mouseenter即可)。但firefox下并没有onMouseEnter、onMouseLeave这两个事件。那么只能使用纯js来解决IE及Firefox的兼容性问题了: 原理:通过判断触发onMouseOut事件后,鼠标到达的元素是不是包含在父元素信息栏内,如果是就表示鼠标还在信息栏上,则不隐藏。如果否就表示鼠标真的移出了信息栏,那么信息栏就要隐藏。 复制代码 代码如下: // 首先来获取触发onMouseOut事件的元素,IE下通过event的toElement属性来获得,firefox下通过event的relatedTarget属性来获得。 IE:event.toElement ,Firefox:event.relatedTarget(注意:Firefox下的event须通过在函数调用时传入,而IE下的event则可以直接通过window.event系统对象来获得) // ① 接下来就是判断获取的元素是否是主体div的子元素(IE下可以通过元素的obj.contains方法来判断,但Firefox下没有这个方法,所以需要给firefox定义元素的obj.contains。 代码如下: if!="undefined") // 给firefox定义contains()方法,IE已经系统自带有这个方法了 { HTMLElement.prototype.contains=function { while(obj!=null&&typeof!="undefind") { // 通过循环对比来判断是不是obj的父元素 if { return true; } obj=obj.parentNode; } return false; }; } // ② 获取和判断搞定后,我们就可以通过判断IE和Firefox来针对处理了,通过navigator.userAgent来判断浏览器类型: if(navigator.userAgent.indexOf { return "MSIE"; } if(navigator.userAgent.indexOf{ return "Firefox"; } // ③ 到此为止所有要解决的问题都得到了解决,当触发onMouseOut事件时,我们将针对不同的浏览器先获取鼠标到达的元素,然后通过判断该元素是否在信息栏内,如果元素是子元素,那么不执行onMouseOut事件,反之则执行事件,隐藏信息栏,完成后的代码如下: function hideMsgBox{ //theEvent用来传入事件,Firefox的方式 if { var browser=navigator.userAgent; //取得浏览器属性 if (browser.indexOf{ //如果是Firefox if (document.getElementById.contains(theEvent.relatedTarget)) {//如果是子元素 return; //结束函数 } } if (browser.indexOf{ //如果是IE if (document.getElementById.contains { //如果是子元素 return; //结束函数 } } } /*要执行的操作*/ document.getElementById.style.display='none' ; …… } // ④ 在信息栏上设置onMouseOut=hideMsgBox来调用。 另外,通过设置window.event.cancelBubble = true ,event.stopPropagation() event.preventDefault 也可以解决问题,但是需要遍历所有子元素,影响效率,所以还是在触发onMouseOut事件时再进行上述判断分别处理比较合适。

document.getElementById("preview").innerHTML="<img src='" getFullPath(document.getElementById('UpFile')) "' width=120 style='border:6px double #ccc'>";

var fileName =fileText.toLowerCase();

}

}

但是我们就是想要获取真实的本地文件路径怎么办呢?

例如我的上传文件控件的HTML代码是:

if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){

 代码如下

//firefox

var file_upl = document.getElementById('file_upl');
file_upl.select();

return obj.files.item(0).getAsDataURL();

你可以通过设置浏览器安全选项得到真实路径:

var realpath = document.selection.createRange().text;

}

 

//ie

if ((fileName!='.jpg')&&(fileName!='.gif')&&(fileName!='.jpeg')&&(fileName!='.png')&&(fileName!='.bmp'))

复制代码

 

if(Sys.firefox){

如果我们用的是Ext,那么我们会使用Ext.ux.form.FileField组件,假设我们赋给它的id是"file_upl",这时同样会产生上面的问题,解决的办法也是一样,但是我们获取到type为file的input才行,而根据"file_upl"获取到的元素根本不是我们所需要的,Ext是自动生成了一个type为file的input,你可以通过DebugBar或其他类似工具看到这个input,它的id是赋给Ext.ux.form.FileField的id加上"-file"的后缀,也就是"file_upl-file",所以获取真实文件路径的
JS代码就是:

...

 

}

 

#判断后缀名

 

可能有些朋友会碰到IE浏览器上传文件时本地路径变成”C:fakepath”的问题

function validateFileSize(id, maxsize) {
            var btnsave = document.getElementById("Button2");
            btnsave.disabled = false;
            var filepath = "";
            var fileupload = document.getElementById(id);
            if (fileupload.value.length < 5) { alert('请选择文件!'); return; }
            var agent = window.navigator.userAgent;
            if (document.all) {
                var isIE7 = agent.indexOf('MSIE 7.0') != -1;
                var isIE8 = agent.indexOf('MSIE 8.0') != -1;
                //IE7和IE8获得文件路径
                if (isIE7 || isIE8) {
                    fileupload.select();
                    filepath = document.selection.createRange().text;
                }
                //IE6获得文件路径
                else
                { filepath = file.value; }
                //PageMethods.ValidateFile(filepath, maxsize, ieCallBack);
                alert(filepath);
            }
            if (agent.indexOf("Firefox") >= 1) {
                alert("FF");
                alert(getValue());
                return false;
                if (fileupload.files) {
                    var size = fileupload.files[0].fileSize;
                    if (size > parseInt(maxsize)) {
                        fileupload.parentNode.innerHTML = '<input type="file" name="' fileupload.name '" id="' fileupload.id '" onchange="disableSave(this);"/> ';
                        alert("文件超过大小!");
                    }
                    else { alert("文件上传成功!"); }
                }
            }
        }

var realpath = document.selection.createRange().text;

#判断IE还是Firefox

复制代码

 代码如下

function getFullPath(obj)

 

}

Internet选项 -> 安全 -> 自定义级别 -> 将本地文件上载至服务器时包含本地目录路径 -> 选“启动” -> 确定

复制代码

但是,作为开发者,我们不能指望客户去这么做,所以我们必须通过代码解决这个问题。

 

alert("对不起,系统仅支持标准格式的照片,请您调整格式后重新上传,谢谢 !");

if (window.navigator.userAgent.indexOf("MSIE")>=1)

document.form1.UpFile.focus();

兼容ie7,8获取上传文件路径

 代码如下

filesize = obj.files[0].fileSize;

alert(filesize);

}

var filesize = 0;

}

else if(window.navigator.userAgent.indexOf("Firefox")>=1)

obj.select();

Sys.ie=true;

}

{

/**
*函数描述:获取input type=file的图像全路径
* @obj input type=file的对象
**/
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;
}
}

var file_upl = document.getElementById('file_upl-file');
file_upl.select();

var filePath = obj.value;

{

复制代码

复制代码

if(obj)

return obj.value;

}

var Sys = {};

{

<input type="file" onchange="document.getElementById('img').src=getFullPath(this);" >

else

return document.selection.createRange().text;

}

}

filesize=image.fileSize;

这在IE7及以前的IE浏览器版本上都没有问题,但是到IE8上面,就不行了,在IE8中你只会获取到这样的路径:"C:fakepathxxx”,其中xxx是你的文件名。

{

<input id="file_upl" type="file" />

}else if(Sys.ie){

 代码如下

 

if(navigator.userAgent.indexOf("MSIE")>0) {

   

{

var fileText =filePath.substring(filePath.lastIndexOf("."),filePath.length);

}

这是怎么回事呢?
原来,IE8出于安全性的考虑,上传文件时屏蔽了真实的本地文件路径,而以“C:fakepath”取代之。

var image=new Image();

{

image.src=filePath;

#判断文件大小

function checkFileChange(obj) {

再补充一些关于文件上传获取的代码(上传文件路径,后缀,大小,文件名)

Sys.firefox=true;

 代码如下

本文章先给大家介绍一个很不错的在ie7,ie8中可获取上传文件路径的函数,后来再详细的补充了一些在ff下获取后缀、大小、文件名代码,各位朋友可参考。

function yulan(){

return obj.value;

var maxLength = 5*1024*1024;

 

{

那么在JS代码中我就可以这样来获取真实的文件路径:

var filePath =getFullPath(document.getElementById('UpFile'));

if(obj.files)

本文由彩世界开奖app官网发布于彩世界平台官方网址,转载请注明出处:JS获取IE上传文件路径、后缀、大小、文件名代码

关键词: 脚本 事件 解决方法 之家