html 点击a标签弹出浏览文件

最新推荐文章于 2020-09-07 17:48:21 发布

weixin_33712881

最新推荐文章于 2020-09-07 17:48:21 发布

阅读量2k

点赞数

文章标签： c#

原文链接：https://my.oschina.net/body/blog/744564

版权

为什么80%的码农都做不了架构师？>>>

<!DOCTYPE html>
<html>
<head>
<title>img.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
   *{padding:0;margin:0;}
   body{font-size:12px;font-family:"微软雅黑";color:#666;background-color:#000;}
   .mmd{width:900px;height:350px;margin:100px auto;position:relative;}
   .mmd .m_msg{
       width:355px;height:80px;background:#fff;position: absolute;top:180px;left:40px;border-radius:6px;
       padding:10px;
   }
   .mmd .m_msg .m_text{width:355px;height:80px;border:1px solid #eee;border-radius:3px;}
   .mmd .m_msg .m_text a{
       width:78px;height:60px;display:block;border-right:1px solid #eee;text-align:center;text-decoration: none;color:#9b9b9b;
       padding-top:20px;
   }
   .mmd .m_msg .m_text a:hover{background:#f2f2f2;}
   .mmd .m_msg .m_text a span{width:30px;height:23px;display:block;border:1px solid red;margin:0 auto;
       background-position:0px 0px;
       margin
   }
   .mmd .m_msg .m_text a input{display:none;}

</style>

</head>

<body>
<div class="mmd">
   <div class="m_msg">
       <div class="m_text">
           <a href="#" οnclick="openBrowse()">
               <span></span>
               图片
           </a>
           <input type="file" id="file" />
           <input type="text" id="fileName" />
       </div>
   </div>
</div>
<script>
   function openBrowse(){
       var ie = navigator.appName = "Microsoft Internet Explorer"?true:false;
       if(ie)
       {
           document.getElementById("file").click();
           document.getElementById("fileName").value = document.getElementById("file").value;
       }else{
           var a = document.createEvent("MouseEvents");
           a.initEvent("click",true,true);
           document.getElementById("file").dispatchEvent(a);
       }
   }
</script>
</body>
</html>