JS - 사용자 정의 AJAX 함수를 만드는 문제

Question

내 AJAX 게시물을 처리하는 함수를 만들려고합니다. 데이터를 전송할 수 있었지만 요청에서 데이터를 수신하는 데 문제가 있습니다.

본질적으로 나는 ajaxPost(paramArray, target)이라는 함수를 가지고 있는데, 이는 매개 변수를 받아들이고이를 target에 제출할 문자열에 넣는 것입니다.

저는이 문제가 ajaxReq.onreadystatechange에서 비롯된 것 같습니다. 스크립트를 끝내고 끝내는 것 같습니다. 호출하는 함수의 예

function ajaxPost(paramArray, target){ 
    var param = ''; 
    var key; 
    for (key in paramArray){ 
     param = param + key + '=' + paramArray[key] + '&'; 
    } 
    param = param.substring(0, param.length - 1); 

    var ajaxReq = new XMLHttpRequest(); 
    ajaxReq.onreadystatechange = function(){ 
     if(ajaxReq.readyState == 4 && ajaxReq.status == 200){ 
      return ajaxReq.responseText; 
      document.write('Test?'); 
     } 
    } 
    ajaxReq.open('POST', target, true); 
    ajaxReq.setRequestHeader('Content-type', "application/x-www-form-urlencoded"); 
    ajaxReq.send(param); 
} 

이 여기에 함수가 '일을한다'고하고,된다

, 여기에 스크립트 내가 제대로 무슨 뜻인지 설명하고 있다면 나도 몰라

입니다 위의 함수는 :

function submitPost(form){ 
    var title = form.title.value; 
    var text = form.textBody.value; 
    var name = form.nameOfPoster.value; 
    var paramArray = new Array(); 
    paramArray['title'] = title; 
    paramArray['text'] = text; 
    paramArray['name'] = name; 
    if (ajaxPost(paramArray, 'post.php')){ 
     location.reload(true); 
    } 
} 

이것은 본질적으로 ajaxPost()에 매개 변수를 전송하고, 뭔가를 반환하는 경우이 페이지를 다시로드합니다.

내가 말했듯이, 나는이 부분의 첫 부분을 언급하는 것을 무시하고 있다고 생각한다. 그 데이터가 수신 될 때까지 함수를 중단시킬 수 있는지 궁금합니다.

내가 jQuery를 사용하여 말하지 마십시오, 나는 자바 스크립트 :

감사를 실험하고있다. 다른 팁이 있으면 첨부하십시오.

Answer 1

AJAX는 비동기입니다. 요청이 완료된 후 ajaxReq.onreadystatechange 기능이 실행되므로 사용하려는 방식대로 작동하지 않습니다. 동시에 스크립트 실행이 중단되지 않습니다. 그래서,이 :

function ajaxPost(paramArray, target, callback){ 
    var param = ''; 
    var key; 
    for (key in paramArray){ 
     param = param + key + '=' + paramArray[key] + '&'; 
    } 
    param = param.substring(0, param.length - 1); 

    var ajaxReq = new XMLHttpRequest(); 
    ajaxReq.onreadystatechange = function(){ 
     if(ajaxReq.readyState == 4 && ajaxReq.status == 200){ 
      callback(ajaxReq.responseText); 
      document.write('Test?'); 
     } 
    } 
    ajaxReq.open('POST', target, true); 
    ajaxReq.setRequestHeader('Content-type', "application/x-www-form-urlencoded"); 
    ajaxReq.send(param); 
} 

및 이상 :

function submitPost(form){ 
    var title = form.title.value; 
    var text = form.textBody.value; 
    var name = form.nameOfPoster.value; 
    var paramArray = new Array(); 
    paramArray['title'] = title; 
    paramArray['text'] = text; 
    paramArray['name'] = name; 
    ajaxPost(paramArray, 'post.php', function(res) { if(res) location.reload(true); }); 
}