determining-the-users-location.zip
在处理惩罚表单的时辰,若是input类型为file时,FF,chrome,IE8获取文件时获取到一个fakepath,而不是真正的文件地址;不过ie6,ie7却可以获取,在IE8之后,安然级别进步了。然则,当呈现一个客户端预览如许的需求的时辰,对于不合浏览器就要采取不消的策略了;IE可以应用滤镜,chrome等可以应用HTML5的体式格式,ie8 input,具体如下:<img id="file_img" src="http://www.09687.com/tourl/op/xx" width="100" height="100"/>
<script type="text/javascript">
var getPath=function(obj){
obj.();
var path=document.ion.createRange().text;
obj.removeAttribute("src");
obj.style.filter=
"alpha(opacity=0);progid:DXImageTransform.Microsoft.AlphaImageLoader(src="""+path+""", sizingMethod=""scale"");";
}
</script>
如许,经由过程滤镜的体式格式获得path,fakepath,不过,应用滤镜时,的左上角会呈现一个小图标,这时,我们可以绕弯的用一个透明作为file_img的src,占用这个src,ie8 input,使得小被显示为透明;
对于FF,网上有一种撒播好久的应用getAsDataURL办法来获取的办法,fakepath,比如:
function getFullPath(obj){
if(obj){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
obj.();
return document.ion.createRange().text;
}
else if(window.navigator.userAgent.indexOf("Firefox")>=1){
if(obj.files){
return obj.files.item(0).getAsDataURL();
}
return obj.value;
}
return obj.value;
}
}
不过,我们可以应用html5的办法来兼容FF,HTML5 File API中定义了一个BlobReader,经由过程它可以应用各类不合的体式格式读入文件并且可以和处理惩罚读取文件过程中的各个状况。不过在Firefox与Chrome的实现中,并没有如许一个BlobReader,取而代之的是FileReader,拥有与BlobReader雷同的办法和事务。
比如:
function getPath(obj,fileQuery){
var file =fileQuery.files[0];
var reader = new FileReader();
reader.onload = function(e){
obj.setAttribute("src",e.target.result)
}
reader.readAsDataURL(file);
}
chrome的解决办法也和FF的一样,应用FileReader对象来实现,fakepath,接下来,我们须要一个完全兼容的版本;
/*fileQuery是指input type为file的对象,在事务中应用this来调换,fakepath,
比如:obj.onChange=function(){
var file_img=document.getElementById("img");
getPath(file_img,this,transImg);
}
transImg是解决IE左上角图标的那张透明的路径;*/
var getPath=function(obj,fileQuery,transImg){
if(window.navigator.userAgent.indexOf("MSIE")>=1){
obj.();
var path=document.ion.createRange().text;
obj.removeAttribute("src");
obj.setAttribute("src",transImg);
obj.style.filter=
"progid:DXImageTransform.Microsoft.AlphaImageLoader(src="""+path+""", sizingMethod=""scale"");";
}
else{
var file =fileQuery.files[0];
var reader = new FileReader();
reader.onload = function(e){
obj.setAttribute("src",e.target.result)
}
reader.readAsDataURL(file);
}
}
当然,也许我们始终感觉用JS的办很烦躁,fakepath,那么可以应用以下2种作为调换规划 1,falsh办法,采取falsh办法也斗劲稳当,ie8 input,没有兼容的纷扰;2,进步前辈办事器,然后再从办事器读取出来;