hide pulsante submit controllo campi required

[pippuccio76]

Salve ho un form, per prevenire la pressione multipla del submit ho inserito un

         <button class='btn btn-info' type='submit' id="alloca" onclick=''>CARICA</button>
         <p id="attendi">ATTENDI....</p>

nel document ready faccio:

                $('#attendi').hide();

        $( "#alloca" ).on( "click", function() {
      
            $('#alloca').hide();
            $('#attendi').show();


        } );

Tutto funziona , ho il problema se non inserisco nessun valore nel campo input con attributo required perchè il pulsante del submit va via e mi viene mostrato il messaggio che va riempito il campo .

https://jsfiddle.net/1Lh9jedc/2/

come posso fare l'hide con il controllo dei vari required (fossero + di uno ) ?

e la stessa cosa per gli alert , come faccio l'hide solamente se non ho alert ?

[alka]

Non si intercetta l'evento click del pulsante, bensì il submit del form.

Se io invio il tuo modulo premendo il tasto INVIO, e questo è sempre possibile, il tasto non verrà nascosto.