IE下附件上传组件样式

最新推荐文章于 2023-01-14 14:53:44 发布

__NewFound__

最新推荐文章于 2023-01-14 14:53:44 发布

阅读量378

点赞数

文章标签： IE 附件上传 css阳似火

本文链接：https://blog.csdn.net/u010553733/article/details/53064331

版权

<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<title>测试管理</title>
<meta name="decorator" content="default" />
<style type="text/css">
.file-btn {
   position: relative;
   display: inline-block;
   overflow: hidden;
}

.file-btn input {
   position: absolute;
   right: 0px;
   top: 0px;
   opacity: 0;
   -ms-filter: 'alpha(opacity=0)';
   font-size: 200px;
   float: right;
}
.div-in-center{
   width: 500px;
   height: 50px;
}
</style>
</head>
<body>
   <form:form id="inputForm" modelAttribute="test" action="${ctx}/test/test/save" method="post" enctype="multipart/form-data">
       <div class="div-in-center">
           <div style="float: left;">
               <input type="text" id="fielName" readonly="readonly"/>
           </div>
           <div class="btn btn-inverse file-btn"> <div>上传</div>
               <input id="file" type="file" name="file">
           </div >
       </div>
       <div class="form-actions">
           <input id="btnSubmit" class="btn btn-primary" type="button" value="保存" /> 
           <input id="btnCancel" class="btn" type="button" value="返回" οnclick="history.go(-1)" />
       </div>
   </form:form>
   <script type="text/javascript">
       $("#file").change(function(){
           $("#fielName").attr("value",this.value);
       });
       $("#btnSubmit").click(function(){
           alert("check form");
       });
   </script>
</body>
</html>

__NewFound__

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
IE下附件上传组件样式

测试管理.file-btn { position: relative; display: inline-block; overflow: hidden;}.file-btn input { position: absolute; right: 0px; top: 0px; opacity: 0;
复制链接

扫一扫