點擊按鈕觸發file標籤並把文件名顯示在文本框

我這裏是一個輸入框,通過點擊輸入框彈出file標籤獲取到FileUpload對象,並把文件的名字放到文本框裏顯示

  <div>
	 <input type="text" id="updateFile" class="form-control batch-upload-text" placeholder="請選擇excel文件" />
	 <input id="file1"  type="file" />
	 </div>

你可以把真正的file標籤隱藏

<script type="text/javascript">
			$(function() {
				//點擊updateFile文本框觸發上傳按鈕
				$("#updateFile").click(function() {
					$("#file1").trigger("click");
				});
				$("#file1").change(function(){
					//獲取FileUpload對象
					var x = document.getElementById("file1").files;
					//把獲得的文件名放入text裏面顯示
					$("#updateFile").val(x[0].name);
				})
			});

		</script>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章