● 送信ボタンクリック時にボタン連打や二重送信を防止しつつ「送信中」を表示する

● html

class に notrepeat　を追加

<button type="submit" class="notrepeat">データ送信</button>

任意のテキストとアイコンをセットすることもできます。

<button type="submit" class="notrepeat" data-loading-text="<i class='fa fa-circle-o-notch fa-spin'></i> データ送信中ですしばらくお待ちください。 ...">データ送信</button>

● js

以下の js を読み込ませる

jquery.notrepeat.js

$(function() {
  $('.notrepeat').each(function(index, element){    
    $(this).on( 'click', function () {
      alert('x');
        if ( $(this).data('loading-text') ){
            $(this).html( $(this).data('loading-text') );
        }
        else {
            $(this).html("<i class='fa fa-circle-o-notch fa-spin'></i> データ送信中 ... ");
        }
        var jq_obj = $(this);
        setTimeout( function() {
            jq_obj.attr('disabled', true);
        }, 1, jq_obj );
    });
  });
});

lodash を使用する方法もあります。 https://qiita.com/gizumon/items/8288142ecd7c57e05dae