underscore.jsのdebounce 2

最近button[type=submit]のダブルクリックに関連して調べてたので、underscore.jsのdebounceが使えるかどうか試してみる

背景は以下の通り

djangoのFormWizardでstepを「戻る」場合だけ、wizard_goto_stepというパラメータを飛ばしたく、djangoのサンプルテンプレートでは、「前に進む」ボタンにはinput[type=submit]を、「戻る」ボタンにはbutton[type=submit][name=wizard_goto_step]を使っている。

できればbuttonをdisabledにする以外の方法でダブルクリックを防ぎたい。

以下は連続クリックできてしまう。buttonのvalueは飛ぶ。
buttonに貼りつけたイベントは500ミリ秒の間は発火しないはずだけど、buttonそのものがformをsubmitさせてしまうと思われる。

    $('button[type=submit]').on('click', _.debounce(function(e){
        e.preventDefault();
        return true;
    }, 500, true))

以下はは連続クリックを制御できるけど、$('form').submit()でサブミットさせてるため、buttonのvalueが飛ばない。
formに要素を突っ込めばできそう

    $('button[type=submit]').on('click', _.debounce(function(e){
        e.preventDefault();
        $('form').submit();
        return false;
    }, 500, true))

type=submitをやめる
これなら連続クリック制御できて、buttonのvalueも飛ぶ

    $('button[type=button].submit_button').on('click', _.debounce(function(e){
        var name = $(this).attr("name");
        var value = $(this).attr("value");
        $("<input type='hidden' />")
            .attr("name", name)
            .val(value)
            .insertAfter($(this));
        $('form').submit();
    }, 500, true))

type=submitを使わない場合は、jQueryのoneを使ったほうがいいかも

Underscore.js