jquery ajax怎麼改成同步

2022-09-09 18:00:47

在jquery中,ajax可以將async設定為false使其同步;預設情況下jquery中的ajax為非同步請求,即「async:true」,通過設定引數「asycn:false」即可,語法為「$.ajax({async: false})」。

前端(vue)入門到精通課程:進入學習

本文操作環境:windows10系統、jquery3.6.1版、Dell G3電腦。

jquery ajax怎麼改成同步

jquery中的ajax 預設情況下為非同步請求,即 async:true,可以通過設定引數 asycn:false 到使其同步

ajax預設是非同步請求;ajax中可以根據async值的不同來判斷是否是非同步請求,若async的值為false,則表示ajax請求為同步,若async的值為true,則表示ajax請求為非同步,而預設情況下async的值是「true」,因此ajax預設是非同步請求。

如果想同步 async設定為false就可以(預設是true)

var html = $.ajax({
url: 「some.php」,
async: false
}).responseText;

或者在全域性設定Ajax屬性

$.ajaxSetup({
async: false
});

再用post,get就是同步的了

範例如下:

隨機生成一個10位數的整數,與後端資料庫做對比,如果後端資料庫中有這個亂數,則重新再生成一個,如果沒有就return這個數。

這個需求涉及到前後端互動,所以無法避免需要使用ajax,於是剛開始我編寫了這樣一段程式碼。

//randID是封裝的生成亂數的函數
function userID() {
    let ranid = parseInt(randID(1000000000, 10000000001));
    let data = null;
    $.ajax({
        type: 'post',
        url: './php/findID.php',
        data: 'id=' + ranid,
        success: function(res) {
            res = JSON.parse(res);
            isok = res.length;
            if (isok != 0) {
                userID();
            } else {               
               return ranid;
            }
        }
    })
}
console.log(userID());

輸出結果:

14.png

jquery.ajax的解決方法

  • 在函數下(ajax外)宣告一個區域性變數

  • 將ajax當成同步處理(jquery.ajax的修改方式:新增這句程式碼即可async: false)

  • 返回宣告的區域性變數

function userID() {
    let ranid = parseInt(randID(1000000000, 10000000001));
    //宣告的區域性變數
    let data = null;
    $.ajax({
        type: 'post',
        url: './php/findID.php',
        data: 'id=' + ranid,
        //將ajax改為同步操作
        async: false,
        success: function(res) {
            res = JSON.parse(res);
            isok = res.length;
            if (isok != 0) {
                console.log(ranid);
                userID();
            } else {
                data = ranid;
            }
        }
    })
    //返回這個區域性變數
    return data;
}
console.log(userID());

輸出結果:

15.png

相關教學推薦:

以上就是jquery ajax怎麼改成同步的詳細內容,更多請關注TW511.COM其它相關文章!