JS 等待 AJAX 公用程式回傳

ajax 等待回傳公用程式

noway 2024-08-02 09:20:37 ‧ 626 瀏覽

分享至

您好：
如下語法
getClassno(str_arr) 共用AJSX 取後端資料回傳
OnBlur_1(參數1)
OnBlur_2(參數2)

目前alert會先跳出，再去執行 getClassno(str_arr)
要如何讓
let obj= getClassno(str_arr); //--後端抓資料的 getClassno(str_arr)執行完畢後
回傳，再繼續跑
alert(obj)?

有試過 async: false ，但沒效

謝謝


 function OnBlur_1() {  

     let obj= getClassno(str_arr); //--後端抓資料
     
     alert(obj)
 }//---

         function getClassno(str_arr) {
            //let result = "";
            let  obj;

            $.messager.progress({ msg: 'get controls ...' });
            setTimeout(function () {

                
                $.ajax({
                    type: "POST",
                    url: '../handler....',  //
                    data: {
                        mode: "method",
                        method: "getClassno",
                        parameters: str_arr
                    },
                    cache: false,
                    async: false, 
                    success: function (data) {


                        result = data; //這邊回傳字串

                         obj = JSON.parse(result);
 
                        return obj;
                    }//--success 
                });

            }, 1);

froce iT邦大師 1 級 ‧ 2024-08-02 09:45:02 檢舉

alert寫在ajax那邊就好。

noway iT邦研究生 2 級 ‧ 2024-08-02 11:29:26 檢舉

這之前單獨一個可以做
但若要改成公用程式，在外面做，就不行

froce iT邦大師 1 級 ‧ 2024-08-02 11:44:29 檢舉

OnBlur_1:
obj.then((data) => {console.log(data)})

另外 getClassno應該要async，並且你沒回傳值...
算了，去看我下面回覆

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

2 個回答

froce

iT邦大師 1 級 ‧ 2024-08-02 12:38:27

最佳解答

https://jsbin.com/moxedigedi/edit?html,js,output

async function getClassno() {
  // setTimeout不是promise，不能直接用await，得用Promise包起來
  function sleep(ms) {
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve();
      }, ms);
    });
  }
  
  await sleep(2000);
  // ajax是隨便找一個打的api
  const res = await $.get("https://api.github.com/users/shawnquinn")

  return res.login
}

getClassno().then((id)=>{alert(id)});

我這沒做錯誤處理，自己做。

回應 1
分享
檢舉

noway iT邦研究生 2 級 ‧ 2024-08-02 16:39:34 檢舉

謝謝!
先拿到settimeout測測
不過您說的 sleep, promise then等用法，沒用過，得自修看看

登入發表回應

thexiu

iT邦見習生 ‧ 2024-08-03 10:07:42

function getClassno(str_arr) {
    let  obj;

    return new Promise((resolve, reject) => {
        $.messager.progress({ msg: 'get controls ...' });

        setTimeout(function () {
            $.ajax({
                type: "POST",
                url: '../handler....',
                data: {
                    mode: "method",
                    method: "getClassno",
                    parameters: str_arr
                },
                cache: false,
                async: false, 
                success: function (data) {
                    result = data; //這邊回傳字串

                    obj = JSON.parse(result);

                    // return obj;
                    resolve(obj);
                }
            });
        }, 1);
    })
}

async function OnBlur_1(){  
    let obj = await getClassno(str_arr); //--後端抓資料
    
    alert(obj)
}

這樣試試看應該可以

建議學一下 Promise async await
這樣以後遇到這種異步問題比較好處理

學會Promise後
我推薦你試試看用JS原生的Fetch API來跟後端進行溝通