んー。なんか腑に落ちない事象だけど。とりあえずメモ。

そもそもなにやりたいの？

とある問い合わせフォームにて、submitを二重送信されることが多かったので止めてほしいとのこと。（スマホとかだと連打しちゃうよねー。押しづらいし）

ちなみに、対象のフォームはキーボードのEnterで送信されないようにonsubmit="return false;"になっているので、jQueryでonメソッドを使った手法でsubmitするようにしている。

        $('#submit').on({
            click : function() {
                $('#submit').text('送信中').css('background', '#ccc'); // 送信 => 送信中に変更して「送信してるよ！」感を出す
                $('form').removeAttr('onsubmit').submit(); // onsubmitを空にして送信する
            }
        });

できた

htmlの属性にdisabledというのがある。それをsubmitの要素に仕込ませばおｋだった。

        $('#submit').on({
            click : function() {
                $('#submit').attr('disabled', 'disabled').text('送信中').css('background', '#ccc'); // attr()でdisabled属性を追加
                $('form').removeAttr('onsubmit').submit();
            }
        });

できなかった

実は上の処理は１時間がんばったあとに見つけたものだった。

最初はunbind()を使っていた。

        $('#submit').on({
            click : function() {
                $('#submit').unbind().text('送信中').css('background', '#ccc');
                $('form').removeAttr('onsubmit').submit();
            }
        });

だが、何故かうまくいかない。

そーいえば、on()ってもともとはbind()だったなーってことを思い出し、on()と対象的なものを調べたら案の定off()というものがあった。

        $('#submit').on({
            click : function() {
                $('#submit').off('click').text('送信中').css('background', '#ccc');
                $('form').removeAttr('onsubmit').submit();
            }
        });

しかし、これもうまくいかず(´・ω・`)

んー、じゃあ上書きしちゃえばいいんじゃね？ということで...

        $('#submit').on({
            click : function() {
                $('#submit').off('click').on('click', function(){}).text('送信中').css('background', '#ccc');
                $('form').removeAttr('onsubmit').submit();
            }
        });

やけくそである。・・・が！

うまくいかず(´；ω；｀)ﾌﾞﾜｯ

えーかげんよくわからん。

しかしブレークポイントを$('form').removeAttr('onsubmit').submit();に付与しデバッグしてみたところ、初回のクリックには引っかかるが２回目以降のクリックにはブレークポイントが反応しない・・・！

が、あいかわらずブラウザ上では連打できる。。。？

何だこの挙動？

挙句の果てには

        $('#submit').on({
            click : function(e) {
                e.preventDefault();
                $('#submit').off('click').on('click', function(){}).text('送信中').css('background', '#ccc');
                $('form').removeAttr('onsubmit').submit();
            }
        });