css控件透明属性设置IE firefor设置方法
<STYLE type=text/css>
.upfilefield{position:absolute; FILTER: alpha(opacity:0);-moz-opacity:0.5;opacity: 0; width:88px; height:29px; top:0px; right:0px;}
</STYLE>

导入:<input type="file" name="file" id="file" class="easyui-validatebox" data-options="required:true" style="position:absolute; FILTER: alpha(opacity:0);-moz-opacity:0.5;opacity: 0;width:150px;"/>
<input type="button" onclick="chooseFile()" value="选择EXCEL表" style="border:none;" />

ie 设置为FILTER: alpha(opacity:0);
firefor 设置为-moz-opacity:0.5;opacity: 0;

function chooseFile(){
document.getElementById("file").click();
}

function fileOnChange()
{
var array1=$('#file').val().split('\\');
var fileName=array1[array1.length-1];
$('#txtFileName').val(fileName);
}

将导入按钮选择文件修改为“选择EXCEL表”

<div style="float:left;width:25px;height:10px;"></div><div style="width:270px;float:left">导入:<input type="file" name="file" id="file" style="position:absolute;width:120px;" class="easyui-validatebox" data-options="required:true" onchange="fileOnChange()" />
<input type="button" onclick="chooseFile()" value="选择EXCEL表" style="border:none;width:120px;" /><input type="text" id="txtFileName" name="txtFileName" style="width:108px;border:none;" readonly="readonly" /></div>
<div style="float:left;"> <input type="button" name="btnsc" id="btnsc" value="上传" class="but20" />
<span style="text-align:right;"><input type="button" name="but" value="模板下载" class="but30" onclick="DownloadTemplate()" />
<input type="button" name="cs" value="查看参数" class="but30" onclick="CheckParams()" /></span></div>

会有个bug:在ie下,单击按钮前半部分无反应:因为在ie下file控件必须单击浏览按钮才可

css控制file控件透明 漂浮的更多相关文章

  1. File控件杂谈

    我们通常使用<input type='file'/>来实现网页中文件上传功能,用户可以通过点击file控件选择本地文件,当我们提交包含该控件的表单时,浏览器会向服务器发送用户选中的文件. ...

  2. 美化type="file"控件

    对于type="file"而言是一个不大好看的控件.如果不美化他一下,总感觉自己的网站有些缺乏了美感 上代码: <!DOCTYPE html> <html> ...

  3. 美化 input type=file控件

    大家都知道input的type=file控件默认样式是不能修改的 可以通过一个小技巧处理下 html: <a href="javascript:;" class=" ...

  4. 混合开发 webview 中file 控件 点击后无反应解决方法

    最近在做个项目 ,需要 使用 file 控件上传 图片到服务器 ,在手机浏览器中 可以正常选择照片,但是放到 android 应用中的webview中,file 控件点击后就没有反应. 百度了一番后, ...

  5. File控件选择图片的时候在Html5下马上预览

    页面HTML <div> <img src="@pic.Path" id="img" style="width:200px;heig ...

  6. input的file 控件及美化

    在一些网站进行上传时,当单击了“浏览”按钮之后会弹出[选择文件]的对话框.想要实现这一功能,用input的file控件来实现就好啦~ <!doctype html> <html la ...

  7. 怎么清除file控件的文件路径

    还记得上次做一个文件上传,后来测试告诉我说,如果我要是不选择文件了呢?该怎么办?我说:简单啊,做一个取消按钮不就完事了吗!然后我就想一个file空间做一个取消是多么简单的事,用js处理可是想怎么样就怎 ...

  8. 为什么Jquery对input file控件的onchange事件只生效一次

    今天在做jquery对input file控件的onchange事件进行监听,就一直只生效一次,不知道Jquery为什么对file控件没有做到每次改变触发onchange事件的效果,但是还是有好几种解 ...

  9. file控件change事件触发问题

    最近,项目中需要用到一个图片上传的功能,我用的file控件来选取图片文件,然后利用js读取文件来预览图片,最后再根据用户的操作来决定是否上传文件. 其中碰到了一个奇怪的问题:在选取完第一张图片,并上传 ...

随机推荐

  1. 记录Yii2代码调试中出现的两个问题(截图展示)

    1.代码会中断执行,不提示错误信息,是由于substr函数第一个参数为数组造成的 2. 谷歌浏览器调试异步调用接口时出现的错误,需在接口返回处进行断点调试 这两个错误比较隐蔽,调试代码时必须认真仔细

  2. Docker学习笔记 - Docker的守护进程

    学习目标:  查看Docker守护进程的运行状态 启动.停止.重启Docker守护进程 Docker守护进程的启动选项 修改和查看Docker守护进程的启动选项 1.# 查看docker运行状态  方 ...

  3. 使用Spring Initializr创建项目

    Spring initializr 是Spring 官方提供的一个很好的工具,可以用来用来创建一个Spring boot 的项目.可以选择使用Maven管理或者使用Gradle管理,还可以选择使用的编 ...

  4. C#日志文件

    写日志文件是一个很常用的功能,以前都是别人写好的,直接调用的,近期写了一个小工具,因为比较小,所以懒得引用dll文件了,直接上网找了一个,很方便,现在记录下 public class LogClass ...

  5. 前端学习之jquery/下

    前端学习之jquery 一 属性操作 html(): console.log($("div").html()); $(".test").html("& ...

  6. SpringBoot(五):@ConfigurationProperties配置参数绑定

    在springmvc或其他ssh框架中如果我们要实现一个配置参数的加载,需要使用代码实现读取properties文件等操作,或者需要使用其他属性@value(name="username&q ...

  7. 使用 RHEL(RedHat)6.1 iso 安装包 安装Samba过程

    今天因为工作的需要安装了(RHEL)redhat 6.1 自己为了方便就安装Samba 以记之. 注:Linux系统是刚刚安装好的所以没有samba安装的任何记录. 安装准备: ISO:RHEL_6. ...

  8. POJ-1751 Highways---确定部分边的MST

    题目链接: https://vjudge.net/problem/POJ-1751 题目大意: 有一个N个城市M条路的无向图,给你N个城市的坐标,然后现在该无向图已经有M条边了,问你还需要添加总长为多 ...

  9. Spring MVC的核心流程(步骤)

    具体步骤: 1.客户端发送请求先要经过前端控制器,请求被Spring 前端控制器DispatcherServlet获取,如详细图第一步:DispatcherServlet对请求URL进行解析(比如我们 ...

  10. 最短路径之Dijkstra算法

    Dijkstra(迪杰斯特拉)算法是典型的最短路径路由算法,用于计算一个节点到其他所有节点的最短路径.主要特点是以起始点为中心向外层层扩展,直到扩展到终点为止.Dijkstra算法能得出最短路径的最优 ...