前端技术(19) : 文件上传去掉“未选择任何文件”及样式改进
【代码】前端技术(19) : 文件上传去掉“未选择任何文件”及样式改进。
·
参考 : input(type="file")中“未选择任何文件”去除，以及样式整改/全选框（type="checkbox"）样式整改_input file 未选择任何文件-CSDN博客
<!DOCTYPE html>
<html>
<head>
<style>
label {
position: relative;
}
#fileinp {
position: absolute;
left: 0;
top: 0;
opacity: 0;
}
#btn {
padding: 5px 10px;
background: #00b0f0;
color: #FFF;
border: none;
border-radius: 5px;
}
</style>
</head>
<body>
<label for="fileinp" onchange="selectFile()">
<input type="button" id="btn" value="选择文件"><span id="text"></span>
<input type="file" id="fileinp">
</label>
</body>
<script>
function selectFile() {
document.getElementById('btn').value = document.getElementById('fileinp').files[0].name;
}
</script>
</html>
魔乐社区（Modelers.cn) 是一个中立、公益的人工智能社区，提供人工智能工具、模型、数据的托管、展示与应用协同服务，为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作，由全产业链共同建设、共同运营、共同享有，推动国产AI生态繁荣发展。
更多推荐
5
0- 0
已为社区贡献21条内容
所有评论(0)