submit 버튼에 비동기 함수 했을때 발생했던 에러

<form method="post">
	<input class="loginbtn" value="로그인" type="submit" onclick="login()" readonly>
</form>

<script>
function login() {
    $.ajax({
        type: "POST",
        url: "/login",
        data: {},
        success: function (response) {
            console.log('ㅇㅇ')
        }
    })
}
</script>

이렇게 했을때 로그가 찍히고 페이지가 로드되서 로그를 볼수없다 이유는

동기적 처리와 비동기 처리가 동시에 일어나기 때문이다.

 

해결방법은 둘중 하나만 쓰는건데 우리는 비동기로 처리했다.

<form method="post">
	<input class="loginbtn" value="로그인" onclick="login()" readonly>
</form>

//타입을 서브밋에서 바꿈