当我为某个按钮（在javascript中）注册一个点击事件时，我希望一个接一个地执行三个ajax调用。它们正确地修改了服务器数据库，但页面中没有显示更改。我注意到，如果我尝试在chrome调试中打开inspector时单击按钮，页面将正确显示更改。我认为这可能是ajax调用的回调函数的冲突问题，但我不知道如何处理它。
下面是处理单击事件的代码

document.getElementById("addCategory").addEventListener('click', (e) => {

            tree.autoclick();

            var form = document.getElementById("addcategoryform")
            if (form.checkValidity()) {
                makeCall("POST", 'AddCategory', e.target.closest("form"),
                    function (x) {
                        if (x.readyState == XMLHttpRequest.DONE) {
                            var message = x.responseText;
                            switch (x.status) {
                                case 200:
                                    document.getElementById("erroradd").textContent = message;
                                    document.getElementById("erroradd").style.color = "green";
                                    break;
                                case 400: // bad request
                                    document.getElementById("erroradd").textContent = message;
                                    document.getElementById("erroradd").style.color = "red";
                                    break;
                                case 401: // unauthorized
                                    document.getElementById("erroradd").textContent = message;
                                    document.getElementById("erroradd").style.color = "red";
                                    break;
                                case 500: // server error
                                    document.getElementById("erroradd").textContent = message;
                                    document.getElementById("erroradd").style.color = "red";
                                    break;
                            }
                        }
                    }
                );
            }
            tree.show();
        }

    )

对于第一棵树，autoclick模拟另一个按钮的单击事件：

this.autoclick = function(){
         var e = new Event("click");
         this.saveButton.dispatchEvent(e);

        }

哪种方法执行ajax post调用，用于在服务器上保存修改完成的客户端树：

saveButton.addEventListener('click', (e) => {
                makeCallParam("POST", 'saveModifies', from, to,
                    function (x) {
                        if (x.readyState === XMLHttpRequest.DONE) {
                            let json = x.responseText;

                            switch (x.status) {
                                case 200:
                                    document.getElementById("message").textContent = json;
                                    document.getElementById("message").style.color = "green";
                                    break;
                                case 400: // bad request
                                    document.getElementById("message").textContent = json;
                                    document.getElementById("message").style.color = "red";
                                    break;
                                case 401: // unauthorized
                                    document.getElementById("messaggio").textContent = json;
                                    document.getElementById("messaggio").style.color = "red";
                                    break;
                                case 500: // server error
                                    document.getElementById("messaggio").textContent = json;
                                    document.getElementById("messaggio").style.color = "red";
                                    break;
                            }
                        }
                    }
                );

            })

在autoclick函数之后，我对最初的click事件（addcategory）执行ajax调用，该事件还修改了服务器上的树
最后，我调用树函数show（），该函数通过get ajax调用请求使用新类别修改树，并调用函数update（）将它们打印到html上。show（）函数不仅在我执行此操作时起作用，在其他情况下，它会正确地显示服务器中的树

show = function() {
            var self = this;
            makeCall("GET", "requestCategories", null,
                function(req) {
                    if (req.readyState == 4) {
                        var message = req.responseText;
                        if (req.status == 200) {
                            categoriesToShow = JSON.parse(req.responseText);
                            if (categoriesToShow.length == 0) {
                                self.alert.textContent = "No categories yet!";
                                return;
                            }
                            self.update(mostraCategorie, document.getElementById("list")); // function that prints list of categories in "list"

                        } else if (req.status == 403) {
                            window.location.href = req.getResponseHeader("Location");
                            window.sessionStorage.removeItem('username');
                        }
                        else {
                            self.alert.textContent = message;
                        }}
                }
            );
        };