JSFiddle - React, Tailwind, and code Playground

HTML

<form method="Post">
<input type="submit" value="Salva" onclick="return conferma(this)" />
<img src="http://upload.wikimedia.org/wikipedia/commons/4/42/Loading.gif" class="loading" />
</form>

CSS

.loading {display:none;}
input[type="submit"]:disabled+.loading {display:inline;}

JavaScript

window.conferma = function(bottone){
    
    //se in precedenza avevo già confermato, restituisco true,
    //così il postback può avere corso
    if ($(bottone).data("confermato")) return true;
    
    //altrimenti devo inviare la richiesta ajax e chiedere conferma
    $.ajax({
        type:'POST',
        url:'/echo/html/',
        data: {
            html: "ciao",
            delay: 1
        },
        success: function(data){
            
            //la richiesta ajax si è conclusa, devo riabilitare il bottone
            $(bottone).prop( "disabled", false );
            
            //qui ovviamente dovrai fare qualcosa con data, altrimenti
            //non ha senso aver inviato una richiesta ajax
            if (confirm("Il server ha risposto: " + data + 
                        "\nVuoi davvero salvare i dati?")){
                
                $(bottone).data("confermato", true);
                //ora che ho confermato, sollevo di nuovo l'evento click
                $(bottone).click();
                
            }
        }
    });
    //disabilito il bottone, per impedire che venga cliccato di nuovo
    //durante la richiesta ajax
    $(bottone).prop( "disabled", true );
    
    //restituisco false, per inibire il postback
    //infatti voglio che il postback si verifichi solo dopo che l'utente
    //ha visualizzato il messaggio di conferma
    return false;
    
}