<form id="picForm" name="picForm"  method="post" enctype="multipart/form-data">
  <input type="file" id="photosfile" name="files" />
  <button class="btn">请选择上传图片</button>
 </form>
<script type="text/javascript">
    document.all.photosfile['files'];
</script>
 
console.log(document.all.photosfile['files'][0]);
 
 
 
//及时查看图片效果
html:
    <div id="show_img"><img src="__IMAGES__/head_img/user.png"></div>
     <input id="file_upload" name="file_upload" type="file" multiple="true">
js:
$("#file_upload").on("change",function(){
  var fileTag = document.getElementById("file_upload").files[0];
  if (fileTag) {
   var reader = new FileReader();
            reader.readAsDataURL(fileTag);
            $("#show_img").find("img").remove();
            reader.onload = function (e) {
                var urlData = this.result;
                document.getElementById("show_img").innerHTML += "<img src='" + urlData + "' alt='" + fileTag.name + "'/>";
            };
        }else{
            return;
        }
  return false;
 })

js获取上传文件信息并及时查看的更多相关文章

  1. js获取上传文件内容(未完待续)

    js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...

  2. Atitit.js获取上传文件全路径

    Atitit.js获取上传文件全路径 1. 默认的value只能获取文件名..安全原因.. 1 2. Firefox浏览器的读取 1 3. Html5 的file api 2 4. 解决方法::使用a ...

  3. js获取上传文件内容

    js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...

  4. JS获取上传文件的绝对路径,兼容IE和FF

    <input type="file" id="fileBrowser" name="fileBrowser" size="5 ...

  5. JS 获取上传文件的内容

    <div> 上传文件 : <input type="file" name = "file" id = "fileId" / ...

  6. js 获取上传文件的字节数及内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. js获取上传文件的绝对路径

    在html中    <input type="file" id="importFile" />    <input type="bu ...

  8. JS获取上传文件的名称、格式、大小

    <input id="File1" type="file" onchange="checkFile(this)" /> 方式一) ...

  9. struts2 JS获取上传文件的绝对路径,兼容IE和FF

    因为file控件上传失败后会自动清空,所以使用文本框来保存上传路径,而且在不同的浏览器下,控件的样式也需要兼容.下面是自己用到的实例 // 初始化判断浏览器的版本,根据版本的不同使用不同的样式func ...

随机推荐

  1. asp.net mvc 提交model 接收不了

    [HttpPost]        //[ValidateInput(false)]        public ActionResult AddNews1(_54Young_News_Model.m ...

  2. 【转载】NativeSQL实例

    转自:http://blog.sina.com.cn/s/blog_3f2c03e301017fqz.html     ---------------------------------------- ...

  3. css3 -&gt; 多栏布局

    在进行多栏布局时.使用bootstrap的栅格系统能够非常轻松的实现效果,事实上css3本身也提供了多兰布局的功能. 比方,我们在一个section标签内填充了非常多内容.同一时候希望内容可以显示成三 ...

  4. hdu 寒冰王座

    呵呵,过了这么久还来刷水题实在是不好意思.本题属于全然背包,就是一模板题.只是窝还是要来水一下.嘻嘻 寒冰王座 Time Limit: 2000/1000 MS (Java/Others)    Me ...

  5. Redis集群服务器-高可用调研随笔[转]

    今天改了一天的Bug,本想下午开始专研Redis命令集,结果也泡汤了.只能在下班的路上考虑下Redis集群服务器的高可用方案.随笔而已,尚未成型,仅作记录. 当然,我说的可能比较片面,欢迎拍砖.斧正. ...

  6. mybatis0201 01复习

    mybatis是什么? mybatis是一个持久层框架,是apache下的开源项目,前身是itbatis,是一个不完全的ORM框架(因为mybatis提供输入和输出的映射,需要程序员自己写sql语句) ...

  7. 条带深度 队列深度 NCQ IOPS

    http://blog.csdn.net/striping/article/details/17449653 IOPS 即I/O per second,即每秒进行读写(I/O)操作的次数,多用于数据库 ...

  8. bash手册 之重定向原理与实现

    http://www.gnu.org/software/bash/manual/bashref.html#Redirections http://www.cnblogs.com/weidagang20 ...

  9. ctkPlugin插件系统实现项目插件式开发

    插件式开发体会: 自开始写[大话QT]系列就开始接触渲染客户端的开发,说是开发不如更多的说是维护以及重构,在接手这块的东西之前自己还有点犹豫,因为之前我一直认为客户端嘛,没什么技术含量,总是想做比较有 ...

  10. Java基础知识强化之集合框架笔记57:Map集合之HashMap集合(HashMap<Student,String>)的案例

    1. HashMap集合(HashMap<Student,String>)的案例 HashMap<Student,String>键:Student      要求:如果两个对象 ...