jQuery Ajax是一種快速訪問Web服務端資源的方法。它是一種異步執行的方式,可以讓客戶端在頁面不刷新的情況下,向服務器發送請求并獲得回應。
其中一個重要的概念是異步(async)。它能夠讓瀏覽器在執行Ajax請求的同時,繼續執行其他JavaScript代碼,而不必等待請求完成。這樣能夠增強用戶體驗,提高頁面響應速度。
在jQuery中使用Ajax的代碼如下:
$.ajax({ method: "GET", url: "https://example.com/data", data: { id: 1 }, async: true }).done(function( data ) { console.log(data); });
上述代碼使用了GET方法向url為https://example.com/data的資源發送了一個id為1的請求,并設定了async為true。當請求完成后,通過done()方法指定回調函數來處理返回的data。
由于異步的特性,如果我們在請求數據的同時執行其他操作,執行順序可能會出現問題。因此,當有多個Ajax請求需要執行時,我們可以使用jQuery的$.when()方法來同步它們的執行順序。
$.when( $.ajax( "https://example.com/firstData" ), $.ajax( "https://example.com/secondData" ) ).done(function( firstData, secondData ) { console.log(firstData[0]); console.log(secondData[0]); });
上述代碼中,使用$.when()方法將兩個Ajax請求進行了同步處理。當兩個請求都完成后,通過done()方法對它們的返回值進行處理。在這里,$ajax()方法返回的是一個包含請求結果的數據對象,因此在.done()方法中用數組索引[0]訪問結果。
雖然在使用jQuery Ajax時異步是默認開啟的,但如果我們想禁用異步特性來確保代碼執行順序,可以將async設置為false,讓請求在同步模式下完成。
$.ajax({ method: "POST", url: "https://example.com", data: { name: "John", location: "Boston" }, async: false }).done(function( data ) { console.log(data); });
上述代碼中,設置async為false來禁用異步特性。由于此時請求是同步進行的,當請求未完成時,后面的代碼無法執行。