博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
input type="file"获取文件名方法
阅读量:4543 次
发布时间:2019-06-08

本文共 743 字,大约阅读时间需要 2 分钟。

文件上传比较丑,样式调整时会有一个获取文件名,或者包含文件路径的文件名的方法

html代码

CSS样式

.file-box{ position:relative;width:340px;margin:20px;}

.txt{ height:28px;line-height:28px; border:1px solid #cdcdcd; width:180px;}
.btn{width:70px; color:#fff;background-color:#3598dc; border:0 none;height:28px; line-height:16px!important;cursor:pointer;}
.btn:hover{background-color:#63bfff;color:#fff;}
.file{ position:absolute; top:0; right:85px; height:30px;line-height:30px; filter:alpha(opacity:0);opacity: 0;width:254px }

效果图

1085921-20180504185022114-1236872720.png

只获取文件名

document.getElementById('fileField').files[0].name

获取带路径的文件名

document.getElementById('fileField').value

转载于:https://www.cnblogs.com/midnight-visitor/p/8992121.html

你可能感兴趣的文章
Flume的监控参数
查看>>
第三天记录
查看>>
Centos下关于ssh、scp与rsync设置与应用
查看>>
排列组合+组合数取模 HDU 5894
查看>>
WCF(一) 创建第一个WCF
查看>>
hdu 6206 apple 点在内接圆外
查看>>
Jquery实现图片自动轮播
查看>>
第一篇:groovy对DSL的语法支持
查看>>
idea Cannot open URL.Please check this URL is correct
查看>>
(转载)C#使用MemoryStream类读写内存
查看>>
自我表水
查看>>
sqlserver中的数据转换与子查询
查看>>
【CF316G3】Good Substrings 后缀自动机
查看>>
【BZOJ2938】[Poi2000]病毒 AC自动机+DFS
查看>>
【BZOJ4750】密码安全 单调栈
查看>>
Java之atomic包的原理及分析
查看>>
Chrome自定义滚动条
查看>>
poj3311(状态压缩dp)
查看>>
《大数据日知录》读书笔记-ch2数据复制与一致性
查看>>
个人冲刺01
查看>>