submitをキャンセルする

とある処理を書いていて、「submitボタンを押しても、POSTしない」ようにしたくなりました。

とりあえずやってみた（for IE）

とりあえずググらないで自力で頑張ってみたところ、IE限定ですが

var submitInputElem = document.getElementById(...);

submitInputElem.onclick = function() {
    if (isSubmitAllowed()) {
        submitInputElem.disabled = false;
    } else {
        submitInputElem.disabled = true;
        alert("submitはできません！");
    }
};

と書けばいいことが判明。

このことからわかるのは、onclickは実際に『ボタンが押された』と判定される前に発生するイベントだということ。
なるほど。

とりあえずやってみた（for Firefox）

Firefoxは、上記のやり方ではダメだったので、強引に次のようにしてみました。
typeの値をbuttonに変えて、サブミットできないようにするという荒業です。

ただしこれは、IEでは使えません。IEではtypeプロパティの値を変えることが
許可されていない（セキュリティ上の理由？）からです。

var submitInputElem = document.getElementById(...);

submit.type = "button";

submitInputElem.onclick = function() {
    if (isSubmitAllowed()) {
        submitInputElem.type = "submit";
    } else {
        alert("submitはできません！");
    }
};

教えて！Google先生！

ググってみたところ、formのonsubmitに、falseを返す関数をセットしてやればいいらしいです。

var submitFormElem = document.getElementById(...);

submitFormElem.onsubmit = function() {
    //submitが許可されたときのみtrueを返す
    if (isSubmitAllowed()) {
        return true;
    } else {
        alert("submitはできません！");
        return false;
    }
};

これはIEでもFirefoxでも動きます。

一方Chromeは

Chromeは、disabled=trueにする方法とtype="button"にする方法のどちらでも動くようです。