onsubmit 에서 폼 을 검사 할 때 ajax 의 return false 를 사용 하면 잘못된 문제 입 니 다.

며칠 전 폼 데 이 터 를 검사 할 때 ajax 를 사 용 했 을 때 return false 가 잘못 되 었 습 니 다.

/**
 *       
 **/
function onSubmit(){
    if($('#name').val().length<2){
        alert("          ");
        return false;
    }
    var t = new Date().getTime();
    $.ajax({
        type: "POST",
        url: "/users/checkrepeat/",
	  data: "name=" + $('#name').val() + "&time=" + t,
        success:function(res){
            if(res == 'exists'){
                alert("     ，   .");
                return false;
            }
        }
    });
}

문제 의 원인:
 
1. ajax 시 return false 의 function 은 onsubmit () 와 같은 함수 가 아 닙 니 다.
2. ajax 가 실 행 될 때 async 의 기본 설정 값 은 true 입 니 다. 이 경우 비동기 방식 입 니 다. ajax 가 요청 을 보 낸 후에 server 단 이 돌아 오 기 를 기다 리 는 과정 에서 프론트 데스크 는 ajax 블록 뒤의 스 크 립 트 를 계속 실행 하고 server 단 이 정확 한 결 과 를 되 돌려 야 success 를 실행 할 수 있 습 니 다. 즉, 이때 실 행 된 것 은 두 스 레 드 입 니 다.ajax 블록 에서 요청 한 스 레 드 와 ajax 블록 뒤의 스 크 립 트 (다른 스 레 드) 를 보 냅 니 다.
 
수 정 된 코드:

/**
 *       
 **/
function onSubmit(){
    if($('#name').val().length<2){
        alert("          ");
        return false;
    }    
    var flag = true;
    var t = new Date().getTime();
    $.ajax({
        type: "POST",
        async:false,  //       
        cache:false,
        url: "/users/checkrepeat/",
	  data: "name=" + $('#name').val() + "&time=" + t,
        success:function(res){
            if(res == 'exists'){
                alert("     ，   .");
                flag = false;
            }
        }
    });
    if(!flag)
        return false;