html

                         <div>
<label class="imgMark">说明:</label>
<div class="erWeiMa">
<img src="" class="imgShow" >
<img src="upload.png">
<input type="file" class="file" >
</div>
</div>

js

$(".file").change(function(){

    $(this).prev().css("display","none");
$(this).prev().prev().css("display","block");//获取上传的图片信息
var file=$(this).get(0).files[0];
//创建用来读取此文件的对象
var reader=new FileReader();
//使用该对象读取此文件的方法函数
reader.readAsDataURL(file);
//读取文件成功后执行的方法函数
reader.onload=function(e){
$(".imgShow").attr("src",e.target.result)
}
});

input file 图片上传展示重新上传的更多相关文章

  1. input file 图片上传

    使用第三方:jquery.ajaxfileupload.jsinput中的name根据后端来定 <form method="post" enctype="multi ...

  2. form input file 图片上传360IE兼容问题

    <form action="" class="form-box" class="form_box" enctype="mul ...

  3. input file图片上传

    <div class="div-title"> <h5>图片上传</h5> <div class="photo-box" ...

  4. input file图片上传预览

    两种方法,方法一: js代码: //头像上传预览 $("#up").change(function() { var $file = $(this); var fileObj = $ ...

  5. input file图片上传预览效果

    两种方法,方法一: js代码: //头像上传预览 $("#up").change(function() { var $file = $(this); var fileObj = $ ...

  6. 上传图片预览JS脚本 Input file图片预览的实现示例

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

  7. js获取 input file 图片缩略图

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

  8. 一段上传图片预览JS脚本,Input file图片预览的实现

    在深圳做项目的时候,需要一个用户上传头像预览的功能!是在网上找了好多,都不太满意.要么是flash的,要么是Ajax上传后返回图片路径的,要么压根就是不能用的.幸运的是在这个项目以前有人写过一个图片预 ...

  9. 根目录97 <input file>标签,把图片上传到服务器(跟增删改查一起实现)

    首先来个简单的html页面: enctype="multipart/form-data" encoding="multipart/form-data" acti ...

随机推荐

  1. 所见即所得:七大无需编程的DIY开发工具

    现如今,各种DIY开发工具不断的出现,使得企业和个人在短短几分钟内就能完成应用的创建和发布,大大节省了在时间和资金上的投入.此外,DIY工具的出现,也帮助广大不具备专业知识和技术的“移动开发粉”创建自 ...

  2. Scrum立会报告+燃尽图(十一月十四日总第二十二次):分配β阶段任务

    此作业要求参见:https://edu.cnblogs.com/campus/nenu/2018fall/homework/2284 项目地址:https://git.coding.net/zhang ...

  3. Struts2(七)

    以下内容是基于导入struts2-2.3.32.jar包来讲的 1.xml验证 Struts2提供了验证器,实现了通用的验证逻辑.例如: 非空验证器.长度验证器.日期验证器.email验证器等.具体定 ...

  4. phpMyadmin导入导出数据中出现的错误处理

    1 2

  5. PHP中访问控制修饰符

    访问控制修饰符 形式: class  类名{ 访问控制修饰符  属性或方法定义: } 有3个访问修饰符: public公共的:在所有位置都可访问(使用). protected受保护的:只能再该类内部和 ...

  6. SQL的拼接语句在DELPHI中怎么写

    SQL 语句的拼接,关键点在于对引号的处理上. 在 delphi 的语法中,使用单引号做字符串的标志符.因此,当遇到 SQL 语句中字符串标识量编写的时候,需要用两个单引号来代替实际的引号. 举例: ...

  7. [LeetCode] [LeetCode] Populating Next Right Pointers in Each Node II

    Follow up for problem "Populating Next Right Pointers in Each Node". What if the given tre ...

  8. 【bzoj2906】颜色 分块

    题目描述 给定一个长度为N的颜色序列C,对于该序列中的任意一个元素Ci,都有1<=Ci<=M.对于一种颜色ColorK来说,区间[L,R]内的权值定义为这种颜色在该区间中出现的次数的平方, ...

  9. 【bzoj5099】[POI2018]Pionek 双指针法

    题目描述 给你 $n$ 个平面向量,选出它们中的一部分,使得它们的和的长度最大.求这个最大长度的平方. 输入 第一行包含一个正整数n(n<=200000),表示指令条数. 接下来n行,每行两个整 ...

  10. WebGL画一个10px大小的点

    WebGL程序在屏幕上同时使用HTML和javascript来创建和显示三维图形.WebGL中新引入的<canvas>元素标签,它定义了网页上的绘图区域. 由于<canvas> ...