上传文件 隐藏input type="file",用text显示
<div>
<span>上传文件:</span>
<input type="file" id="upload_file" style="display: none;" onchange="change();">
<input type="text" id="upload_file_tmp" readonly="readonly" onclick="upload_file.click(); ">
<button type="button" class="file" id="select_file" onclick="upload_file.click();" >
选择文件
</button>
</div>
input[type="text"] {
height:20px;
border:none;
border-bottom:1px solid #ccc;
width:150px;
margin-right:10px;
outline:none;
height:25px; }
.file {
outline: none;
border:none;
background: #67BEF4;
border-radius: 4px;
padding: 4px 12px;
cursor:pointer;
color: #fff;
font-size:18px;
line-height: 20px;
vertical-align: middle;
}
function change(){
document.getElementById("upload_file_tmp").value=document.getElementById("upload_file").value;
}
上传文件 隐藏input type="file",用text显示的更多相关文章
- FormData上传文件(input file)
<div> <input type="file" name="FileUpload" id="FileUpload" va ...
- Ajax 上传文件(input file FormData)
FormData对象用以将数据编译成键值对,以便用XMLHttpRequest来发送数据.其主要用于发送表单数据,但亦可用于发送带键数据(keyed data),而独立于表单使用. jQuery Aj ...
- 隐藏<input type="file"> 实现点击div或图片打开文件选择路径
HTML: <input type="file" style="display:none" id="addfile-btn"> ...
- 给上传文件的input控件"美容"
作为一名前端程序猿呢,在工作中经常会遇到form表单这种东西.然而表单的其他input控件样式还是很好改变的.但是,唯独input类型是file的文件上传控件可能就没那么好打扮的漂亮.刚好菜鸟我最近工 ...
- 给上传文件的input控件“美容”
在工作中经常会遇到form表单这种东西.然而表单的其他input控件样式还是很好改变的.但是,唯独input类型是file的文件上传控件可能就没那么好打扮的漂亮. demo: html代码 <b ...
- hadoopmaster主机上传文件出错: put: File /a.txt._COPYING_ could only be replicated to 0 nodes instead of minReplication (=1). There are 3 datanode(s) running and 3 node(s) are excluded in this operation.
刚开始装好hadoop的时候,namenode机上传文件没有错误,今天打开时突然不能上传文件,报错 put: File /a.txt._COPYING_ could only be replicate ...
- 利用jquery来隐藏input type="file"
<li> <input type="text" name="token" value = "<?php ech$_SESSIO ...
- input[type="file"]上传图片并显示图片
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- [转]Spring Boot修改最大上传文件限制:The field file exceeds its maximum permitted size of 1048576 bytes.
来源:http://blog.csdn.net/awmw74520/article/details/70230591 SpringBoot做文件上传时出现了The field file exceeds ...
随机推荐
- 1015: [JSOI2008]星球大战starwar
1015: [JSOI2008]星球大战starwar Time Limit: 3 Sec Memory Limit: 162 MB Description 很久以前,在一个遥远的星系,一个黑暗的帝国 ...
- 【JavaWeb】Spring+SpringMVC+MyBatis+SpringSecurity+EhCache+JCaptcha 完整Web基础框架(一)
Spring+MyBatis 首先要搭建的是Spring+MyBatis的整合框架,毕竟Spring是整个Web框架的核心部位,而数据库操作是一切测试的基础嘛. 目录结构 ━java ┣ contro ...
- canvas-渐变文字
html要求: <body onload="draw('canvas');"> body这里的onload一定要写,在这个处理模式下,是在body这里执行加载页面完成后 ...
- mybatis:choose when otherwise标签
choose标签是按顺序判断其内部when标签中的test条件是否成立,如果有一个成立,则 choose 结束. 当 choose 中所有 when 的条件都不满则时,则执行 otherwise 中的 ...
- Java之使用Hadoop探索大数据的世界
什么是大数据 PB = 1024tb 7123913827189tb Reids 无共享 HDFS 优点 :特别适合存储大型文件 TFS hdfs 架构 NameNode: 整个hadoop总管,只有 ...
- linux 主机名
查看主机名命令:# uname -n csdba #hostname csdba 1.通过hostname命令.命令格式:hostname newhostname 此命令的作用是暂时的修改linux的 ...
- [01] cocos2d-x开发环境搭建
cocos2d-x 是跨平台的游戏开发引擎,支持的平台有 ios , android , windows phone , web , tizen,windows等. 先来搭建开发环境,一般我们开发游戏 ...
- MongoDB【第一篇】MongodDB初识
NoSQL介绍 一.NoSQL简介 NoSQL,全称是”Not Only Sql”,指的是非关系型的数据库. 非关系型数据库主要有这些特点:非关系型的.分布式的.开源的.水平可扩展的. 原始的目的是为 ...
- Node.js之路【第三篇】NodeJS异步实现
NodeJS异步实现 Node.js异步编程的直接体现就是回调,它依托于回调来实现,但不能说使用了回调他就是异步了 回调函数在完成任务后就会被调用,Node使用了大量的回调函数,Node所有的API都 ...
- 布局TextView和EditText区别,layout_width和lay_weight区别--Android Studio
1. TextView控件是文本表示控件,主要功能是向用户展示文本的内容,它是不可编辑的,如设置标题:EditText控件是编辑文本控件,主要功能是让用户输入文本的内容,它是可以编辑的.每一个控件都有 ...