다른 약속이 약속을 사용하여 완료된 후에 Javascript 기능을 실행하는 방법은 무엇입니까?

Question

js 약속을 사용하여 값을 데이터베이스에 저장 한 후 페이지를 새로 고침하고 싶습니다.

내 코드는 jQuery를 이벤트 리스너 내부에 싸여있다 :

$("img[class=okButton]").click(function(){ 
    var field_userid = $(this).attr("id"); 

    doThisFirst(); 

    // then make a promise 
    const wait = ms => new Promise(resolve => setTimeout(resolve, ms)); 
    wait(500).then(() => writeNewRoom(field_userid)); // function to write to database 

    refreshPage(); // after write has finished 
}); 

/////////////////// 

function writeNewRoom(field_userid)){ 
// ajax to do something; 
} 

/////////////////// 

function refreshPage(){ 
if(window.confirm("Click to refresh")){location = location} 
} 

의도 된 행동이 후, 처음으로 데이터를 처리합니다 (refreshPage에서 페이지를 새로 고침하기 전에)합니다 (writeNewRoom에서 "일을"기능을 종료하는 것입니다) 기능.

실제로는 첫 번째 doThisFirst() 함수가 올바르게 처리되지만 세 번째 함수의 window.confirm 상자는 writeNewRoom 함수가 실행되기 전에 팝업됩니다.

나는 전에 약속을 한 번도 사용하지 않았으므로 누구든지 잘못 된 것을 알아낼 수 있습니까? mozilla 웹 사이트에서 기본 구문을 사용했습니다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises

모든 도움을 주시면 감사하겠습니다.

Answer 1

귀하의 경우 writeNewRoom() 방법으로 다시 전화를 걸고 싶습니다.

예를 들어 .click() 함수에서 수행해야하는 작업을 호출하고 데이터베이스 작성을위한 아약스 호출이 완료되면 .done() 메서드를 호출합니다. 당신의 // ajax to do something; 반환하는 경우

$("img[class=okButton]").click(function(){ 
    var field_userid = $(this).attr("id"); 

    doThisFirst(); 

    // Remove the Promise 
    writeNewRoom(field_userid); // function to write to database 
}); 

function writeNewRoom(field_userId) { 
    $.ajax({ 
     url: "/someurl", 
     method: "method", 
     data: { 
      a: field_userId 
     } 
    }).done(function(data) { 
     console.log('success', data) 
     refreshPage(); // This is where you refresh the page. 
    }).fail(function(xhr) { 
     console.log('error', xhr); 
    }); 
} 

Answer 2

약속 (jQuery.ajax() 않습니다) 당신이 이런 식으로 작업을 수행 할 수 있습니다

wait(500).then(() => writeNewRoom(field_userid)) 
     .then(() => refreshPage()); 

가이기도 여기 function writeNewRoom(field_userid))

Answer 3

하나 추가 괄호 writeNewRoom(field_userid) 인 경우 ajax 호출을 수행하면 refreshPage() -function을 ajax 호출의 콜백에 넣으므로 Ajax가 완료된 후 실행됩니다. 예 :

function writeNewRoom(field_userid)){ 

    $.ajax({ 
     url: "someUrl", 
     type: 'GET', 
     success: (result) => { 
      refreshPage() //when ajax has succeded, refresh page 
     }, 
     error: (err) => { 
     //do something else 

     } 
    }); 

}