<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><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(); alert(document.selection.createRange().text); 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>~~~~以上的方法在 双击打开网页 或者 自己的电脑作为web服务器的情况 没问题,到时放到实际远程web服务器中 会因为浏览器的安全限制 IE还是不能获得用户所选文件在用户文件系统的绝对路径,较为好一点的方法 是滤镜加载图片 但是不够完美 如下:
----------------------------------------
<script type="text/javascript">
var himgCH; //头像在320视窗中的计算高度 $(function(){ var supportFileReader; try{ if( (typeof FileReader) =='function') supportFileReader = true;}catch(e){ supportFileReader=false; } var isie = navigator.userAgent.toLowerCase().indexOf('msie')>=0; $('#himgfile').change(function(){ if(navigator.userAgent.toLowerCase().indexOf('msie')<0 || supportFileReader ){ //(!ie or ie10) chrome , firefox var file = this.files[0]; //用户选择的文件 if(! /image\/\w+/.test(file.type) ){ //file.type 文件的mime值 alert("请选择图像文件"); }else{ var reader = new FileReader(); reader.readAsDataURL(file);//用户选择的文件readAsDataURL reader.onload = function(){ // $('#pic4up').attr('src',this.result); $('#p_up').attr('src', this.result); $('#p_prev').attr('src', this.result); var img = new Image(); img.src = this.result; setTimeout(function(){ //不能马上获得img的计算高度 适当延时 // console.log(img.width); $('#scale').val( img.width/320 );himgCH = $('#p_up').height();
$('#p_up').height(himgCH); $('#p_up').imgAreaSelect({aspectRatio:'1:1', onSelectChange: preview}); },100 ); } } }else{ //ie 6 7 8 //alert('using ie8- , file value:' + this.value); // $('#pic4up')[0].src=this.value; this.select(); // $('#pic4up')[0].src = document.selection.createRange().text; var img = new Image(); //alert('choose file path:' + document.selection.createRange().text ); var fpath = document.selection.createRange().text; //获取文件域的路径 // $('#p_prev')[0].src = img.src = $('#p_up')[0].src = fpath; //文件本地路径 赋值给img.src 实现预览//AlphaImageLoader实现预览 关键点: AlpahaImageLoader src=本地路径 加载的是客户端文件系统的本地路径 AlphaImageLoader加载的图片位于 容器背景和内容之间
img.src = fpath; //获取图片的原始尺寸 $('#p_prev,#p_up').each(function(i, ele, eles){ this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);"; this.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fpath; if(this.id == 'p_prev') this.src = 'images/blank320_320.gif'; });setTimeout(function(){ //不能马上获得img的计算高度 适当延时
// alert(img.width); $('#scale').val(img.width/320); himgCH = $('#p_up').height(); $('#p_up').height(himgCH); $('#p_up').imgAreaSelect({aspectRatio:'1:1', onSelectChange: preview}); },100 ); }//$('.iMask').removeClass('hide');
$('.btn_disable').addClass('btn_enable'); });