通過button控制input控件上傳文件


         出於安全方面的考慮,通過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" οnchange="alert('上傳成功')"/>
			<button>上傳視頻</button>
		</div>
	</body>
</html>



發佈了27 篇原創文章 · 獲贊 9 · 訪問量 4萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章