上传文件 隐藏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 ...
随机推荐
- initialization & finalization
Delphi 的pas文件中可以有initialization和finalization两个关键字, 1.initialization关键字: 在initialization关键字到finalizat ...
- Wrong list
1.背包dp[i][j]无论当前物品是否不大于j都可以转移dp[i-1][j] 2.循环从0开始还是1开始的问题 3.无向图边集数组开两倍 4.(3*987654321) > maxint 4. ...
- EBS中加载FORM使用的JavaBean的JAR包
1.SSH端,APP用户登录: 2.输入env,确定环境变量名称FORMS_WEB_CONFIG_FILE: 3.定位模板文件: $AD_TOP/bin/adtmplreport.sh con ...
- jQuery中10个非常有用的遍历函数
使用jQuery,可以 很容易的选择HTML元素.但有些时候,在HTML结构较为复杂时,提炼我们选择的元素就是一件麻烦的事情.在这篇教程中,我们将探讨十种方 法去精炼和扩展我们将要操作的集合. HTM ...
- [mark] Linux下如何批量删除空文件
可以使用 xargs 命令来批量处理,代码如下: $ find . -name '*' -type f -size 0c | xargs rm -f
- java后台对前端输入的特殊字符进行转义
转自:http://www.cnblogs.com/yangzhilong/p/5667165.html java后台对前端输入的特殊字符进行转义 HTML: 常见的帮助类有2个:一个是spring的 ...
- 修改Firebug字体
Firebug是一件非常好用的调试工具,然而默认的字体有些单调,设置里又没有更改的选项,那么字体到底能不能更改呢?这个问题困扰了我好久,直到今天我才偶然发现了解决方案. Firebug属于火狐的一个插 ...
- 基础知识《十》unchecked异常和checked异常
运行时异常在运行期间才能被检查出来,一般运行期异常不需要处理.也称为unchecked异常.Checked异常在编译时就能确定,Checked异常需要自己处理. checked 异常也就是我们经常遇到 ...
- MFC2016.6.8
1.theApp extern声明之后不可以使用?可以用,只是需要extern之后的类名和类名称写对,不要犯得低级错误.2.怎样取出列表控件中的第某列的值?GetItemText(); CListCt ...
- .net测试学习--理解.net测试选项
1.创建基于测试简单应用程序 (1)启动visual studio(有安装c#的) (2) 选择File|New project (3)创建一个C# project,名字和保存路径自己设定,假设取名 ...