`
qxmcool
  • 浏览: 90867 次
  • 性别: Icon_minigender_1
  • 来自: 石家庄
社区版块
存档分类
最新评论

HTML实现上传表单有图片预览

HTMLJavaXHTML
阅读更多 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script> 
	function viewmypic(mypic,imgfile) { 
	if (imgfile.value){ 
		mypic.src=imgfile.value; 
		mypic.style.display=""; 
		mypic.border=1; 
} 
} 
</script> 
<title>无标题文档</title>
</head>

<body>

<center> 
<form > 
<input name="imgfile" type="file" id="imgfile" size="40" onchange="viewmypic(showimg,this.form.imgfile);" /> 
<br /> 
</form> 
<img name="showimg" id="showimg" src="" style="display:none;" alt="预览图片" /> 
<br /> 
</div> 
<div style="display:none"> 
</div> 
</center> 

</body>
</html>
分享到：
| ORACLE常用
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    带有图片预览功能的上传表单的完整HTML

    带有图片预览功能的上传表单，完整的HTML代码如下所示 &lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312"&gt; &lt;title&gt;带有图片预览功能的上传表单jb51.net&...

    HTML5意见反馈提交表单页面模板.zip

    HTML5意见反馈提交表单页面模板支持文本编辑，图片上传预览，联系方式，账号非空检测，帮助中心等功能。

    HTML5意见反馈提交表单页面模板.rar

    HTML5意见反馈提交表单页面模板支持文本编辑，图片上传预览，联系方式，账号非空检测，帮助中心等功能。

    HTML5文件上传美化表单 支持拖拽上传

    文件上传在网页中应用十分广泛，对于一般的文件上传控件，基本都是浏览器自带的外观，...今天要介绍的这款插件不仅让文件上传表单更为美观，而且可以预览图片，以及删除待上传的文件等功能，堪比一个小型的文件管理器。

    php+h5+canvas+jcrop 实现网页上传图片并对原图等比缩放后进行裁剪

    实现过程:在HTML中对图片进行上传，在图片文件还未上传至服务器仍停留在form表单时，对该文件进行处理，在此过程中先获取原图的64位base编码，然后利用canvas对原图进行等比缩放，将缩放之后的图片生成新的64位base...

    JS HTML5拖拽上传图片预览

    file类型的的表单控件选择的每一个文件都是一个file对象，而FileList对象则是这些file对象的集合列表，代表所选择的所有文件。file对象继承于Blob对象，该对象表示二进制原始数据，提供slice方法，可以访问到字节...

    php + WebUploader实现图片批量上传功能

    webuploader主要用来做文件的上传，支持批量上传和图片预览，图片预览是将图片生成base64数据直接在标签中使用，所以能够达到的效果是未真正上传图片可以先看到上传的效果。更多具体的介绍，可以上webuploader的官方...

    JavaScript实现无刷新上传预览图片功能

    无刷新上传功能如何实现？手写无刷新上传要用到两个东西，FormData和FileReader。 FileReader 用于图片浏览。 FormData 用于ajax请求。 html代码 先创建表单跟图片的容器 &lt;form enctype="multipart/form-data...

    具有多文件上传、拖拽、进度条和图像预览功能的文件上传插件

    具有多文件上传、拖拽、进度条和图像预览功能的文件上传插件，支持跨域、分块、暂停恢复和客户端...可与任何服务端平台（如PHP、Python、Ruby on Rails、Java、Node.js、Go等）一起使用，支持标准的HTML表单文件上传。

    多图上传预览删除无需插件.htm

    （此文件不含上传后台文件）需要一个多图上传并预览，可删除的功能，找了很多资料，试了ssi-uploader.js，都不成功，自己写了一个最简单的，不需要任何组件，直接以正常form表单提交就可以

    HTML5意见反馈提交表单页面模板特效代码

    HTML5意见反馈提交表单页面模板支持文本编辑，图片上传预览，联系方式，账号非空检测，帮助中心等功能。

    将tinymce编辑器移植到lotus domino平台，解决了图片附件上传的问题

    1.修改了\RichEditer\iXs_Editor\plugins\advimage\editor_plugin.js的js文件以实现插入图片的功能,其他所有功能都在表单上。 2.用js提取了图片文件路径。然后进行处理。 3.移植的很不充分，我对这个编辑器也是...

    PHP实现上传多图即时显示与即时删除的方法

    当type=file的input框框的onchange事件===》》》post数据提交到隐藏的ifram（form表单的target指定）===》》》接收到post数据的直接 echo script标签来返回数据到前端页面并且赋值，然后存储图片路径也是用隐藏域...

    jQuery File Upload文件上传插件-其他

    jQuery File Upload 是一个 jQuery 图片上传组件，支持多文件上传、取消、删除，上传前缩略图预览、列表显示图片大小，支持上传进度条显示；支持各种动态语言开发的服务器端。 特征： 1、多文件上传： 允许一次选择...

    富头像上传编辑器演示

    富头像上传编辑器是一款支持本地上传、预览、视频拍照和网络加载的flash头像编辑上传插件，可缩放、裁剪、旋转、定位和调色等... 小巧的身材：文件大小仅仅只有 50 KB，而新浪的头像编辑器组件有 58.1 KB，更有甚者...

    mini-uploader:一个简单的小型html5 ajax上传器

    特征： 多次上传块上传并行上传内部队列管理器完全自定义界面拖放上传图片预览事件、回调和 API 可扩展带有 fastes Javascript Class 代码的面向对象代码支持的浏览器： 火狐 17+ Chrome 10+ Safari 7+ 浏览器 10+ ...

    超实用的jQuery代码段

    7.15 动态表单生成图片预览 7.16 平滑滚动的导航菜单 7.17 图片的放大预览 7.18 实现平滑的图片动态缩放效果 7.19 自动适应的窗口背景 7.20 如何判断加载多张图片的完成状态 7.21 鼠标悬停时的图片放大 7.22 淡出...

    jquer实例大全【清晰版】

    jQuery上传压缩图片 jQuery社会华分享插件 jQuery生成带指定图像效果js二维码 jQuery在线问卷出题 jquery-自动关闭消息通知插件 Unicode转码汉字 vue车检时间计算器 vue订单确认模板 web打印拖拽打印 电影座位购买...

    H-ui.admin_v2.3.1

    │ lightbox2 图片预览组件 │ │ html5.js html5插件，让低版本IE支持html5元素 │ DD_belatedPNG_0.0.8a-min.js 解决IE6png透明 │ swfobject.js Flash插件 │ expressInstall.swf 检查flash插件 │ ...

Magicbox
Global site tag (gtag.js) - Google Analytics