Javascript Ajax调用完成后如何执行函数

我有两个函数，第一个函数有ajax调用，所以我希望第二个函数在ajax调用（这里我正在重新加载页面）完成后执行，你能帮我吗？
这里是下面的代码

<div id="exapnd_or_collapse_div" class="exapnd_or_collapse_div" onclick="changeLayout();">
<script>
function changeLayout () {
    alert('change layout');

    try {
        jQuery.ajax({
            url:'<%=resourceURL.toString()%>',
            dataType: "text",
            data:{
                <portlet:namespace  />cmd:'changeLayout'
            },
            error: function(){
             alert("AJAXError");
            },
            type: "post",

            success: function(data) {

                if("success" == data) {

                    location.reload();
                }
            }
        }).done(function(){
            exapndCollapse(); 
          });


    } catch(e) {
        alert('waiting: ' + e);
    }
};

function expandCollapse() {


            jQuery("div.Search_Styled-dropDown").css("display", "none");
            jQuery("span.menu-text").css("display", "none");

            jQuery("ul.Common_ul").css("display", "none");
            jQuery("img.module_images").css("width", "25px");
            jQuery("img.module_images").css("margin-top", "20px");
        jQuery("img.module_images").css("height", "21px");
            jQuery("#search_box").css("display", "none");   
        jQuery("#Escaped_toggle").css("margin-right", "94%");   
        }
</script>

功能更改布局（）{
警报（“更改布局”）；
试一试{
jQuery.ajax({
url:“”，
数据类型：“文本”，
数据：{
cmd:'changeLayout'
},
错误：函数（）{
警报（“AJAXError”）；
},
类型：“post”，
成功：功能（数据）{
如果（“成功”==数据）{
location.reload（）；
}
}
}).done（函数（）{
exapndCollapse（）；
});
}捕获（e）{
警报（“等待：”+e）；
}
};
函数expandCollapse（）{
jQuery（“div.Search_-Styled-dropDown”）.css（“display”、“none”）；
jQuery（“span.menu text”）.css（“显示”、“无”）；
jQuery（“ul.Common_ul”）.css（“显示”、“无”）；
jQuery（“img.module_images”）.css（“宽度”、“25px”）；
jQuery（“img.module_images”）.css（“页边空白顶部”、“20px”）；
jQuery（“img.module_images”）.css（“height”，“21px”）；
jQuery（“搜索框”）.css（“显示”、“无”）；
jQuery（“#转义#切换”）.css（“右边距”、“94%”）；
}

试试这个，但我已经创建了一个示例，可以根据您的要求更改代码

function exapndCollapse(){

    //execute your script here
    //if u want reload the page means write your script here

}

function changeLayout () {
var myval = 'test';
    $.ajax({
          url:'script.php',
          type: "POST",
          data: {"myval":myval},
          success: function(data){
              //call the after ajax success 
              exapndCollapse(); //whatever the function call 
          },error: function() { 
              console.log("error");
          } // This is always fired
   });   
};    

---

正如您所知，Ajax是用来发出异步请求的。这意味着客户端无需等待服务器的响应因此在这个Ajax过程中，对象处于不同的状态（，即从0到4）。这些是：

• 0:请求未初始化
• 1：已建立服务器连接
• 2：收到请求
• 3：处理请求
• 4：请求已完成，响应已准备就绪

因此，根据您的要求，有两种解决方案：

function changeLayout() {
    try{
        jQuery.ajax({
            url:'<%=resourceURL.toString()%>',
            dataType: "text",
            data:{
                <portlet:namespace  />cmd:'changeLayout'
            },
            type: "post",

            beforeSend: function(){
                //before send this method will be called
            },
            success: function(data) {
                //when response recieved then this method will be called.
            }
            complete: function(){
                //after completed request then this method will be called.
            },
            error: function(){
                //when error occurs then this method will be called.
            }
        });
    }catch (e) {
        alert(e);
    }
}

• 您可以发出同步请求（但不建议这样做）
• readystate值为4时，需要调用第二个函数

参考下面的代码，它将帮助您：

function changeLayout() {
    try{
        jQuery.ajax({
            url:'<%=resourceURL.toString()%>',
            dataType: "text",
            data:{
                <portlet:namespace  />cmd:'changeLayout'
            },
            type: "post",

            beforeSend: function(){
                //before send this method will be called
            },
            success: function(data) {
                //when response recieved then this method will be called.
            }
            complete: function(){
                //after completed request then this method will be called.
            },
            error: function(){
                //when error occurs then this method will be called.
            }
        });
    }catch (e) {
        alert(e);
    }
}

函数更改布局（）{
试一试{
jQuery.ajax({
url:“”，
数据类型：“文本”，
数据：{
cmd:'changeLayout'
},
类型：“post”，
beforeSend:function（）{
//在发送之前，将调用此方法
},
成功：功能（数据）{
//收到响应后，将调用此方法。
}
完成：函数（）{
//完成请求后，将调用此方法。
},
错误：函数（）{
//当发生错误时，将调用此方法。
}
});
}捕获（e）{
警报（e）；
}
}

---

希望这能帮助您：）

location.reload（）；在成功重新加载页面中，不调用函数重新加载后，我只想调用expandCollapse（）；若您重新加载页面，那个么您将无法完成ajax请求。页面重新加载不会管理ajax完成事件。请检查拼写：

exapndCollapse（）

expandCollapse（）

。这是你的问题吗？什么有效，什么无效？尝试使用portlet首选项保存对象的状态。当您试图重新加载页面时，将丢失对象的所有状态。因此，无论你在它之后执行什么，都不会反映@PVBRaju