Use jquery to get the upload file name and display it in the input form

Implementation code:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	
		<script src="bootstrap-3.3.7-dist/jquery/jquery-3.5.1.min.js"></script>
	</head>
	<body>
		<input type="file" id="file" style="display: none;" onchange="getName()"/>
		<input type="text" id="showFileName"/>
		<button type="button">浏览</button>
		<!-- //调用方法 -->
		<script type="text/javascript">
			$('button').click(function(){
    
    
				$('#file').click();
			});
			function getName(){
    
    
				var file = $('#file')[0].files[0];
				var fileName = file.name;
				
				$('#showFileName').attr("value",fileName);
			} 
		</script>
	</body>
</html>

Show results

Insert picture description here
Insert picture description here
Insert picture description here

Guess you like

Origin blog.csdn.net/weixin_44067333/article/details/110664980