input type=file上传的图片怎样获取图片路径给img的src属性

部分html代码

<div id="upload">
    <form action="{:U('Index/uploadhandler')}" enctype="multipart/form-data" method="post" id="imgform">    
            <div id="imglist">

            </div>
            <div id="updiv">
            <input type='file'  name='photos' class="upfile">
            </div>              
            <input type="submit" value="提交">
    </form>
</div>

jq代码

$(function(){
        var imgurl=[];
        function createfile(){
        $('#updiv').append("<input type='file'  name='photos' class='upfile'>");
        }
        function showimg(url){
            var img='<img src="'+url+'"/>';
            $('#imglist').append(img);
        }
        function addfile(){
            showimg($(this).val());
            $(this).hide();
            createfile();
            $('.upfile').bind('change',addfile);
        }
        $('.upfile').bind('change',addfile);
    })

---

如果你要考虑兼容的话，可以考虑下百度的 http://fex.baidu.com/webuploader/ 已经做了封装了，对于不支持的则用了flash 但是接口保持一致

---

FileReader API

http://jsfiddle.net/tjqsL5oL/

---

这个问题是否是对等于：

建议题主阅读下面的文章来获取解决方案；

• jquery实现上传图片本地预览效果

• 用JQuery获取File input里面的数据

应该有相关的jquey插件

这个插件我没有找到，但是当我看到ace的处理方案时候，看到了很大一坨，找到后会补充。

---

目前我在内部项目中是这样使用的

var objUrl = getObjectURL(this.files[0]) ;
  if (objUrl) {
            imgShow.attr("src", objUrl);
        }

  function getObjectURL(file) {
    var url = null;
    if (window.createObjectURL != undefined) { // basic
        url = window.createObjectURL(file);
    } else if (window.URL != undefined) { // mozilla(firefox)
        url = window.URL.createObjectURL(file);
    } else if (window.webkitURL != undefined) { // webkit or chrome
        url = window.webkitURL.createObjectURL(file);
    }
    return url;
}