<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. Nginx域名配置文件bak

    server { listen 80; server_name m.abd.com; rewrite ^(.*)$ https://$host$1 permanent; } server { list ...

  2. CodeForces-920E Connected Components? 广度搜索 双向链表 判断联通 大量重复节点的删除

    题目链接:https://cn.vjudge.net/problem/CodeForces-920E 题意 给一个补图,问各个联通块有几个元素,升序排列 注意maxn=2e5, maxm=2e10 思 ...

  3. SNMP学习

    http://blog.sina.com.cn/s/blog_4502d59c0101fcy2.html 简单网络管理协议(SNMP)是TCP/IP协议簇的一个应用层协议.在1988年被制定,并被In ...

  4. java实现上传图片

    1.将图片上传到tomcat下 2.将相对路径存放到数据库中 @RequestMapping(params="upLoadPicture") @ResponseBody publi ...

  5. Connect to MongoDB

    https://docs.mongodb.com/getting-started/csharp/client/ MongoDB C# Driver is the officially supporte ...

  6. xss  多分类 优选 贝叶斯、逻辑回归、决策树

    import re import numpy as np from sklearn import cross_validation from sklearn import datasets from ...

  7. WebAPI的自动化监控和预警

    Metrics.net + influxdb + grafana 构建WebAPI的自动化监控和预警 前言 这次主要分享通过Metrics.net + influxdb + grafana 构建Web ...

  8. []HAOI2008] 硬币购物 解题报告 ( 完全背包+容斥原理)

    题目链接:https://www.luogu.org/problemnew/show/P1450 题目描述: 题解: 如果去掉限制的话,这就是一个完全背包. 我们可以考虑先去掉限制,把这个完全背包做出 ...

  9. BZOJ 1391 网络流

    vis[0]没有清零查一年- //By SiriusRen #include <cstdio> #include <cstring> #include <algorith ...

  10. 我的Spring MVC第一个应用

    Product package com.mstf.bean; import java.io.Serializable; /** * Product类,封装了一些信息,包含三个属性 * @author ...