您的位置:首页 > 其它

通过button控制input控件上传文件

2014-10-21 21:25 260 查看
         出于安全方面的考虑,通过JS修改input-file的value是无法正确上传文件的,只有当鼠标真正单击在上传控件的浏览按钮所添加的文件才可以上传。

因此采用定位的方式,将input控件与button放在同一位置上,将input设为透明后,虽然我们只能看到button,但是input控件实际上是位于上一层。所以当点击的时候是触发的input的点击事件。

demo.html:

<html>
<head>
<style type="text/css">
div{position:relative;}
input{width:100px; height:30px; border:1px solid red; position:absolute;opacity:0;}
button{width:100px; height:30px;}
</style>
</head>
<body>
<div>
<input type="file" onchange="alert('上传成功')"/>
<button>上传视频</button>
</div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息