Home > Web Front-end > Front-end Q&A > How to change jquery ajax to synchronization

How to change jquery ajax to synchronization

WBOY
Release: 2022-09-09 16:13:53
Original
3908 people have browsed it

In jquery, ajax can set async to false to make it synchronized; by default, ajax in jquery is an asynchronous request, that is, "async:true", by setting the parameter "asycn:false", The syntax is "$.ajax({async: false})".

How to change jquery ajax to synchronization

The operating environment of this article: Windows 10 system, jquery version 3.6.1, Dell G3 computer.

How to change jquery ajax to synchronization

Ajax in jquery is an asynchronous request by default, that is, async:true, you can make it synchronous by setting the parameter asycn:false

ajax defaults to an asynchronous request; in ajax, you can determine whether it is an asynchronous request based on the async value. If the value of async is false, it means that the ajax request is synchronous. If the value of async is true, it means that the ajax request is asynchronous. By default, the value of async is "true", so ajax is an asynchronous request by default.

If you want to synchronize async, set it to false (the default is true)

var html = $.ajax({
url: “some.php”,
async: false
}).responseText;
Copy after login

Or set the Ajax attribute globally

$.ajaxSetup({
async: false
});
Copy after login

Then use post, get will be synchronized

The example is as follows:

Randomly generate a 10-digit integer and compare it with the back-end database. If there is this random number in the back-end database number, regenerate one, if not, return this number.

This requirement involves front-end and back-end interaction, so it is inevitable to use ajax, so I wrote such a piece of code at the beginning.

//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());
Copy after login

Output result:

How to change jquery ajax to synchronization

jquery.ajax solution

  • at Declare a local variable under the function (outside ajax)

  • Treat ajax as synchronous processing (modification method of jquery.ajax: add this code to async: false)

  • Return the declared local variable

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());
Copy after login

Output result:

How to change jquery ajax to synchronization

Related tutorial recommendations: jQuery video tutorial

The above is the detailed content of How to change jquery ajax to synchronization. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template