show() перезаписано несколько вызовов ajax

Question

У меня есть один элемент html (elem1) и 2 функции JS (func1, func2), который скрывает и показывает elem1 соответственно. Эти JS-функции делают индивидуальные вызовы ajax, а func2 звонит func1 внутри.

Задача: Мне нужно позвонить func2, который внутренне звонит func1. Переписка func1 шторы скрыты elem1. После звонка func1, я хочу showelem1. Но этот show не работает.

JSFiddle: https://jsfiddle.net/46o93od2/21/

HTML:

<div id="elem"> 
Save ME 
</div> 
<br/> 

<button onclick="func1()" id="func1">Try Func1</button> 
<button onclick="func2()" id="func2">Try Func2</button> 

JS:

function func1() { 
    $.ajax({ 
     url: '/echo/json/', //use the correct processing url here 
     type: "POST", 
     data: {}, // send in your data 
     success: function (data) { 
      //var aData = JSON.parse(data); // there is no data to parse 
       $('#elem').hide();  
     }, 
     error: function (xhr, errmsg, err) { 
      alert('error'); 
     } 
    }); 
} 


function func2() { 
    $.ajax({ 
     url: '/echo/json/', //use the correct processing url here 
     type: "POST", 
     data: {}, // send in your data 
     success: function (data) { 
      //var aData = JSON.parse(data); // there is no data to parse 
       func1(); 
      $('#elem').show();  
     }, 
     error: function (xhr, errmsg, err) { 
      alert('error'); 
     } 
    }); 
} 

Answer 1

Сделать func1 принимают функцию обратного вызова, которая сообщает ему, что делать после того, как он получает ответ. func2 может передать функцию, которая показывает элемент.

function func1(callback) { 
    $.ajax({ 
    url: '/echo/json/', //use the correct processing url here 
    type: "POST", 
    data: { 
     json: '' 
    }, // send in your data 
    success: function(data) { 
     if (callback) { 
     callback(); 
     } else { 
     $('#elem').hide(); 
     } 
    }, 
    error: function(xhr, errmsg, err) { 
     alert('error'); 
    } 
    }); 
} 


function func2() { 
    $.ajax({ 
    url: '/echo/json/', //use the correct processing url here 
    type: "POST", 
    data: { 
     json: '' 
    }, // send in your data 
    success: function(data) { 
     func1(function() { 
     $('#elem').show(); 
     }); 
    }, 
    error: function(xhr, errmsg, err) { 
     alert('error'); 
    } 
    }); 
} 

DEMO