Javascriptでsubmit処理をしています。

以下のようなソースを書いているのですが、Submit用のボタン（画像）を押しても再クリック出来てしまいます。

二重送信させたくないのですが、どのような書き方をすればよいのでしょうか？
ソースの訂正・アドバイスいただければと思います。


▼フォームのソース
<form action="test.php" method="post" name="reqForm">
<a id="formSbm" href="javascript:formSubmit();"><img src="sbm_button.jpg"></a>
</form>

▼Javascriptのソース
function formSubmit(){
document.reqForm.submit();
document.reqForm.formSbm.disabled = true;
return false;
}

案1)

submit されたかどうかを管理する変数を追加する

submitted = false ; // Submit フラグ

function formSubmit() {
  if (submitted == true) return ; 
  submitted = true ;
  document.reqForm.submit() ;
  return false ;
}

案2)

a 要素では disabled の値は無効なので button 要素に変えます。

見た目がボタンになるのが嫌ならスタイルシートで変更します。

<form action="test.php" method="post" name="reqForm">
<button id="formSbm" onclick="formSubmit();"><img src="sbm_button.jpg"></button>
</form>

こんにちは

GoldenDawnさんの案１でも問題ないように思えるのですが、ひょっとして再クリックできてしまうというのは、フォームはsubmitされなくても、リンクが存在しているだけで駄目ということでしょうか？

それであれば、以下のようなのはいかがですか？

HTML

<form action="test.php" method="post" name="reqForm">
<!-- サブミット前に表示 -->
<div id="before" style="display: block">
<a id="formSbm" href="javascript:formSubmit();"><img src="sbm_button.jpg"/></a>
</div>
<!-- サブミット後に表示 -->
<div id="before" style="display: none">
<img src="sbm_button.jpg">
</div>
</form>

JavaScript

function formSubmit() {
  // <a>タグ付きの<img>タグを非表示にする
  document.getElementById('before').style.display = 'none';
  // <a>タグなしの<img>タグを表示する
  document.getElementById('after').style.display = 'block';

  document.reqForm.submit() ;
}

目的によってはちょっと冗長かもしれませんが。

何かの参考になれば。