Jquery click button to submit form asynchronously and synchronously

Recently I am developing a jsp student information management system. Since I have just come into contact with jsp, I have encountered many problems, so I will record it and share it with you.

Jquery ajax submission form to servlet example

Front-end part code:

    <form class="addSud" method="post" action="">
        <table>
        <tr>
        <td class="textRight">姓名</td>
        <td colspan="2"><input type="text" id="name" name="name"></td>
        <td class="textRight">学号</td>
        <td colspan="2"><input type="text" id="studentId" name="studentId"></td>
        </tr>
        <tr>
            <td colspan="5">    <input type="submit" id="addStudents" value="提交"></td>
        </tr>
    </table>
    </form>

ajax submission form code:

    //增加学生，异步提交学生表单
    $("#addStudents").click(function() {
        $.ajax({
            url: "addStudents.do",//要请求的服务器url 
            //这是一个对象，表示请求的参数，两个参数：method=ajax&val=xxx，服务器可以通过request.getParameter()来获取 
            //data:{method:"ajaxTest",val:value},  
            data: {
                name: $("#name").val(),
                studentId: $("#studentId").val(),
            },
            async: true,   //是否为异步请求
            cache: false,  //是否缓存结果
            type: "POST", //请求方式为POST
            dataType: "json",   //服务器返回的数据是什么类型 
            success: function(result){  //这个方法会在服务器执行成功是被调用 ，参数result就是服务器返回的值(现在是json类型) 
                if(result){
                    alert("true");
                }else{
                    alert("false");
                }
            }
          });
    });

web.xml configuration code:

  <servlet>
    <description>This is the description of my J2EE component</description>
    <display-name>This is the display name of my J2EE component</display-name>
    <servlet-name>addStudents</servlet-name>
    <servlet-class>org.cms.students.addStudents</servlet-class>
  </servlet>

  <servlet-mapping>
    <servlet-name>addStudents</servlet-name>
    <url-pattern>/addStudents.do</url-pattern>
  </servlet-mapping>

addStudents.java code (using POST submission method):

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        PrintWriter out = response.getWriter();
        String name=request.getParameter("name");
        System.out.println(name);
        System.out.println("123456789");
        out.print("false");
    }

ajax Submit the form

After passing the above configuration, I entered the student's name and submitted the form, but the name and the string "123456789" were not printed in the myeclipse console, and then I started crazy checking and checked n times , I still don’t know where the error occurred. By chance, I discovered the problem. I added an alert() statement after the ajax code block, and a miracle happened. The browser popped up the corresponding content, and the name and string "123456789" were printed in the console of myeclipse. This made me very confused. After consulting a lot of blogs After going to the official documentation, I realized that everything is the reason for JQuery ajax's synchronous and asynchronous submission.
First, let’s understand the JQuery ajax method:

Understanding of asynchronous: When the code is executed to the ajax part, it is executed together with the external code after ajax. If there is external code at this time that needs to use the return value in ajax, And the async attribute of ajax is true (that is, ajax is asynchronous at this time), then it is impossible for subsequent external code to get the return value of ajax. It can only be set to synchronization, that is, the async attribute of ajax is true, and when the ajax part is executed , and then when subsequent code is executed, continuity will occur in the relationship, so that the return value can be obtained.

Then I set async to false, and the problem was really solved, but I still don’t know why the name and string can be printed out even asynchronously after adding an alert statement?
Continue to check the information and my own summary is as follows (any experts are welcome to give advice):

1. When async: true: When the submit button is clicked, the code statement in the click event is executed. When ajax is executed, due to asynchronous execution, Therefore, it will not block the execution of the subsequent statements, because there are no subsequent statements, so it may be that the ajax ended before the click event had time to execute, so the name and string were not printed out. If you add an alert statement after ajax, the click event will be blocked here. At this time, ajax will have enough time to execute, so the console can print out the name and string. I tried to remove the outer click event and execute ajax directly. At this time, the name and string can be printed regardless of synchronous or asynchronous, which can prove my conjecture.
2. When async:false: When the submit button is clicked, the code statement in the click event will also be executed. When ajax is executed, since it is executed synchronously, you must wait for ajax to return successfully before continuing to execute the subsequent code. Naturally, Can print out names and strings.