<form method="post" id="imgForm" action ="/hi/holdHead" enctype="multipart/form-data">
  <input type="hidden" id="householdId_img"  name="householdId_img"/>
  <img src='\view\img\shangchuan1.png' alt='' id='img' width="126px" />
  <input type='file' id='iptfileupload' name="photoFilePic" />
</form>

//file按钮隐藏
$(function(){
  $("#iptfileupload").hide();
  $("#img").click(function(){
  $("#iptfileupload").trigger("click");
});

//input file

$("#iptfileupload").change(function(event){
var file = event.target.files[0];
var reader = new FileReader();
reader.onload = function(e){

//要显示的图片
$("#img").attr("src",e.target.result); 
}
reader.readAsDataURL(file);
});

h5 图片回显的更多相关文章

  1. jfinal 后台文件上传(结合上一篇(h5 图片回显))

    前端用了jquery.form.js插件异步提交表单 $("#imgForm").ajaxSubmit();//户主头像 /** * * @description 上传户主头像 * ...

  2. java图片上传及图片回显1

    目的:选择图片,进行图片回显之后将图片保存到服务器上(PS:没有使用任何插件,样式很丑) 实现方式: js+servlet+jsp的方式来实现 事先准备: 文件上传处理在浏览器中是以流的形式提交到服务 ...

  3. vue element upload图片 回显问题

      beforeUpload (file) { var _this = this; var reader = new FileReader(); reader.readAsDataURL(file); ...

  4. 如何用input标签上传多个图片并回显

    本文主要记录如何用input标签和jquery实现多图片的上传和回显,不会涉及后端的交互,大概的效果看图 我们从零来做一个这样的demo 第一步: 我们先完善一下我们的页面,默认的input-file ...

  5. 淘淘商城学习笔记 之 上传图片到远程服务器,图片的回显出现的bug

    最近在学习淘淘商城中用到的技术,感觉受益良多,遇到一个比较奇怪的bug调了好久,遂心乐之分享于诸君 bug情况是这样的:在商城的后台上传图片之后图片回显不出来,右键查看链接,发现链接被加了localh ...

  6. 百度富文本Ueditor将图片存在项目外路径并回显

    我的毕设中需要一个类似新闻发布的功能,使用到百度富文本编辑器,不过百度富文本编辑器有点坑(只是我太菜了),粘贴图片和回显这个坑坑了我两天时间.效果是这样的: 就是可以在文本中粘贴图片并显示出来,直接说 ...

  7. ueditor1.4.3jsp版成功上传图片后却回显不出来与在线管理显示不出图片的解决方案

    这是因为路径问题,可以在jsp/config.json这个文件去改路径 通过“imageUrlPrefix”与“imagePathFormat”这两个属性去拼凑路径. “imageUrlPrefix” ...

  8. WebUploader 上传图片回显

    /* fileMaxCount 最大文件数 buttonText 按钮文本 multiple 是否多选 */ (function ($) { $.fn.extend({ uploadImg: func ...

  9. 图片上传并回显Ajax异步篇

    图片上传并回显Ajax异步篇 图片如何无刷新的上传到服务器呢?继前两篇文章后,我们来实战一下如何无刷新的异步上传图片,我们还是先看一下效果 在实战前呢,我们需要做些准备工作.比如说,了解一下FormD ...

随机推荐

  1. React+Webpack+ES6环境搭建(自定义框架)

    引言 目前React前端框架是今年最火的.而基于React的React Native也迅速发展.React有其独特的组件化功能与JSX的新语法,帮助前端设计有了更好的设计与便捷,而React Nati ...

  2. POJ 1198 / HDU 1401 Solitaire (记忆化搜索+meet in middle)

    题目大意:给你一个8*8的棋盘,上面有四个棋子,给你一个初始排布,一个目标排布,每次移动,可以把一个棋子移动到一个相邻的空位,或者跨过1个相邻的棋子,在保证棋子移动不超过8次的情况下,问能否把棋盘上的 ...

  3. autosar

    AUTOSAR – RTE(1)基本概念 1. RTE概述 The Run-Time Environment (RTE) is at the heart of the AUTOSAR ECU arch ...

  4. ActiveMQ:JMS开源框架入门介绍

    介绍基本的JMS概念与开源的JMS框架ActiveMQ应用,内容涵盖一下几点: 基本的JMS概念 JMS的消息模式 介绍ActiveMQ 一个基于ActiveMQ的JMS例子程序 一:JMS基本概念 ...

  5. oracle和mysql的分页

    如果我们是通过JDBC的方式访问数据库,那么就有必要根据数据库类型采取不同的SQL分页语句,对于MySql数据库,我们可以采用limit语句进行分页,对于Oracle数据库,我们可以采用rownum的 ...

  6. Laravel修炼:服务容器绑定与解析

    前言   老实说,第一次老大让我看laravel框架手册的那天早上,我是很绝望的,因为真的没接触过,对我这种渣渣来说,laravel的入门门槛确实有点高了,但还是得硬着头皮看下去(虽然到现在我还有很多 ...

  7. 05004_Linux的其他命令和权限命令

    1.其他命令 (1)显示当前所在位置 命令:pwd (2)搜索命令 a.命令:grep 要搜索的字符串 要搜索的文件 示例:搜索/etc/sudu.conf文件中包含字符串to的行 b.搜索/etc/ ...

  8. 国庆 day 2 下午

    最大值(max) Time Limit:1000ms   Memory Limit:128MB 题目描述 LYK有一本书,上面有很多有趣的OI问题.今天LYK看到了这么一道题目: 这里有一个长度为n的 ...

  9. [Test] Easy automated testing in NodeJS with TestCafe

    Quickly get up and running with sensible automated testing scenarios written in ES6. Installing and ...

  10. HP-lefthand底层结构具体解释及存储灾难数据恢复

    HP-lefthand底层结构具体解释及存储灾难数据恢复 一.HP-lefthand的特点 HP-lefhand是一款很不错的SAN存储,使用iscsi协议为client分配空间. 它支持RAID5. ...