上传文件 隐藏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 ...
随机推荐
- Redis Cluster 分区实现原理
Redis Cluster本身提供了自动将数据分散到Redis Cluster不同节点的能力,分区实现的关键点问题包括:如何将数据自动地打散到不同的节点,使得不同节点的存储数据相对均匀:如何保证客户端 ...
- 【原创】自己动手写工具----XSmartNote [Beta 3.0]
一.前面的话 在动笔之前,一直很纠结到底要不要继续完成这个工具,因为上次给它码代码还是一年多之前的事情,参考自己动手写工具----XSmartNote [Beta 2.0],这篇博文里,很多园友提出了 ...
- HDU 4006The kth great number(K大数 +小顶堆)
The kth great number Time Limit:1000MS Memory Limit:65768KB 64bit IO Format:%I64d & %I64 ...
- IIS7.5使用web.config设置伪静态的二种方法
转自 网上赚钱自学网 .http://www.whosmall.com/post/121 近几天公司里开发的项目有几个运行在IIS7.5上,由于全站采用的是伪静态,因此从网上找到两两种方法来实现.这两 ...
- canvas刮刮乐效果(pc端&H5、zepto-touchmove)
一.html <div id="canvasArea" style="width:300px;height:200px;position:relative;&quo ...
- Selenium+python 配置
1. 安装python, www.python.org. 下载最新的python,应该是32位的.注意配置环境变量. 2. 安装PIP(pip是一个以Python计算机程序语言写成的软件包管理系统). ...
- Python Day19
Django Python的WEB框架有Django.Tornado.Flask 等多种,Django相较与其他WEB框架其优势为:大而全,框架本身集成了ORM.模型绑定.模板引擎.缓存.Sessio ...
- nodejs URL解析
说到URL就需要提一下URI,一个网址就是一个URL,是一个具体的符号,说明了要通过什么协议来访问某种资源,URI是一个字符格式规范,URL是URI的一个子集,URL肯定是URI,但URI却不一定是U ...
- shc
A tool for encrytion of bash shell scripts . Install: wget http://www.datsi.fi.upm.es/~frosal/sourc ...
- HashTable初次体验
用惯了数组.ArryList,初次接触到HashTable.Dictionary这种字典储存对于我来说简直就是高大上. 1.到底什么是HashTable HashTable就是哈希表,和数组一样,是一 ...