[JavaScript Code] 파일 업로드

$(document).ready(
	$(function() {
		$("#file_input4").on(
			'change',
			function() {
				mappingPath = $(this).val();
				console.log(mappingPath);

				if (window.FileReader) {
					var filename = $(this)[0].files[0].name;
				} else {
					var filename = $(this).val().split('/').pop()
						.split('\\').pop();
				}
				$("#userfile4").val(filename);
			});

	})
);

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="<%=request.getContextPath()%>/resources/js/board.js"></script>
<script data-search-pseudo-elements defer
	src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/js/all.min.js"
	crossorigin="anonymous"></script>

<div class="row mb-3">
	<div class="col-8">
		<div class="row">
			<div class="col-10">
				<input id="file_input4" filestyle="" type="file"
					style="display: none"> <input type="text"
					id="userfile4" class="form-control" name="userfile4"
					disabled="">
			</div>
			<div class="col-2 p-0 m-0 d-flex justify-content-start align-items-center">
				<label for="file_input4" class="btn btn-default"> <span
					class="glyphicon fa fa-upload"></span>
				</label>
				<button type="button" class="btn-close" id="erase_btn4" aria-label="Close"></button>
			</div>
		</div>
	</div>
</div>