file控件隐藏的处理的方法

最新推荐文章于 2021-06-04 07:12:08 发布
最新推荐文章于 2021-06-04 07:12:08 发布
阅读量2.8k 收藏
点赞数
分类专栏： JAVA 文章标签： file class button xhtml input html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/frankzcy/article/details/8087066
版权

因为IE禁止JS调用file控件的提交，下面是一种实现方式。供大家参考。

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<style type="text/css">
  .file{
  width:300px;height:80px;
  position:relative;
  } 
  .file_file{
  width:300px;
  filter:alpha(opacity=0);
  opacity:0;
  position:absolute;left:0px;top:0px;
  z-index:10;
  }
  .file_txt{
  width:240px;height:20px;
  text-align:left;
  border:1px #a8a8a8 solid;
  position:absolute;left:0px;top:0px;
  z-index:1;
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  line-height:20px;
  }
  .file_button{
  width:50px;height:22px;
  background:#a8a8a8;
  position:absolute;right:0px;
最低0.47元/天 解锁文章
frankzcy
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
HTML——014file控件，实现文件上传专用； hidden隐藏用户id指令
sk_girl的博客
04-18 361
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>file控件</title> </head> <body> <!--file控件：文件上传专用。--> <input type="file" /> </body> </html> HTML代码在浏览器上的对应页面如下：
隐藏file元素
12-19
web开发中免不了使用file元素，如果不做特殊处理，不仅影响页面的排版，而且页面很不雅观，本文讲解了一种简单的处理方法
隐藏file控件，用button实现文件上传
weixin_33894992的博客
03-15 768
为什么80%的码农都做不了架构师？>>> ...
如何在java程序中设置文件为“隐藏”属性
流浪狗的专栏
11-21 519
[code="java"]public class 设置文件属性 { // 执行以下代码你将看到一个属性为隐藏的文件（D:\ddd.ddd） // 请到D盘下查看 public static void main(String[] args) throws IOException { // 创建新文件 File file = new File("D:\\ddd.ddd"); // 删...
隐藏file上传文件
07-16
这是一个隐藏 html file 控件上传图标文件的示例，功能齐全，包括： 1. 隐藏 file 控件 2. 上传文件不刷新整个页面 3. 上传成功后后台调用前台的js函数，更新 img 中的src，实现用上传图标文件 更新 img 中图片的效果。 值得一看。
html file 隐藏,html css隐藏input的file特性
weixin_31979781的博客
06-03 194
.selectbtn .s2 {left: 0;overflow: hidden;top: 6px;}.selectbtn .s1, .selectbtn .s2 {// background: url("../images/scbg.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);border: 0 none;color: #fff;display: bl...
关于input的file 控件及美化
12-14
美化file控件 .file-box { position: relative; width: 340px; } .txt { height: 22px; border: 1px solid #cdcdcd; width: 180px; } .btn { background-color: #FFF; border: 1px solid #CDCDCD; ...
基于jquery跨浏览器显示的file上传控件
12-09
2. **隐藏原生控件**：将`input[type=file]`设置为透明，并使用CSS定位使其完全覆盖在模拟的文本框和按钮之上。 3. **事件处理**：监听`input[type=file]`的`onchange`事件，当用户选择文件后，通过JavaScript将...
定义input type=file 样式的方法
09-28
在这个例子中，`.txt`和`.btn` 分别设置了文本框和按钮的样式，而`.file`则是用于隐藏真实的文件选择控件。通过`onchange`事件，我们可以实时更新文本框中的文件名，使用户能够看到所选文件的信息。 此外，还可以...
vsPrinter控件的属性方法和事件
01-15
vsPrinter控件是一个用于快速开发打印模块的强大工具，它提供了丰富的属性、方法和事件，使得开发者能够轻松地处理打印任务。本文将深入探讨vsPrinter控件的主要特性和使用方法。 一、基本使用步骤 1. **设置设备*...
上传文件 隐藏input type="file"，用text显示
热门推荐
Jacey's Blog
09-25 2万+
html： 上传文件 <input type="file" class="form-control" id="upload_file" name="upload_file" style="display: none;" onchange="change();"> <input type="text" clas
查看系统隐藏进程busybox&unhide
centosa的博客
04-17 3731
** Busybox ** 防止非法用户替换原有命令，导致执行命令时同时执行恶意程序。 下载busybox #wget https://busybox.net/downloads/binaries/1.21.1/busybox-x86_64 #chmod +x busybox-x86_64 #mv busybox-x86_64 /root/busybox 更改环境命令别名 #vim /root...
在android设备中使用busybox
coolcary的博客
10-19 1434
1.  下载busybox busybox-armv7l   2.   # mkdir/data/busybox, 在设备上新建目录 将busybox-armv7l 重命名为busybox后push 进手机的这个目录 3.   更改权限 cd  /data/busybox/ # chmod 655 busybox 4.   安装busybox ./busybox --insta
html5 隐藏 file,input[type=file]去掉“未选择任何文件”及样式改进
weixin_29041195的博客
06-04 4020
input 标签的 file 属性，在没有选择文件的情况下，默认显示一条文字“未选择任何文件”。在选择文件后，该条文字会变成路径和文件的名称。如何去掉其默认的“未选择任何文件”提示呢？查阅资料，没有发现可以直接修改的办法，但是我们可以通过其他方法，实现自定义提示文字的效果。我通过label 标签绑定 input 标签，然后隐藏 input ，添加 button 和 span来自定义提示语：HT...
将html中的<input type="file" />(选择文件) 元素隐藏，并通过其它方式触发点击。file input 美化
sibaoguoying的博客
03-08 9404
file input的默认外观实在不好看，所以我们要搞定它。。 1. 首先，我们把file input放入一个label，并且将这个label显示为一定的宽高，比如显示为(bootstrap)btn的样式（这个label你把样式搞成啥样都行，都不会影响后面的功能）; 2. 为此input增加样式，内联或css文件内写都可以：style="left:-9999px;position:ab
file CSS控制 隐藏file框，图标触发事件
永不停歇
02-26 4586
.file{     width:300px;height:80px;     position:relative;     }      .file_file{     width:10px;     filter:alpha(opacity=0);     opacity:0;     position:absolute;left:0px;top:0px;     z-ind
html file 隐藏,将html中的<input type="file" />(选择文件) 元素隐藏，并通过其它方式触发点击。...
weixin_42462474的博客
06-03 1082
file input的默认外观实在不好看，所以我们要搞定它。。1. 首先，我们把file input放入一个label，并且将这个label显示为一定的宽高，比如显示为(bootstrap)btn的样式;2. 为此input增加样式，内联或css文件内写都可以：style="left:-9999px;position:absolute;"3. 在label内增加文本(作为label btn的显示文...
file控件、隐藏域、readonly和disable
weixin_53126056的博客
12-12 560
file控件 <form action="http://www.baidu.com" > <!-- 文件选择按钮 --> 文件：<input type="file" /> <br> <!-- 上传按钮 --> <input type="submit" value="上传文件"/> </form> 隐藏域，不希望用户看到的内容，但是希望这个数据将这个数据提交过去 - hidden 隐藏
UniGUI开发详解：事件执行、控件显示与Excel交互
15. TUniHiddenPanel用途：隐藏面板常用于存放不直接显示但需要在页面间共享的组件。 16. UniDBGrid导出为Excel：通过生成CSV或XLS文件并提供下载链接实现。 17. UniGUI对Excel的导出支持：使用特定的库或组件，将...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值