2度押し防止ボタン

質問

HTML5 + CSS3 でスマートフォンゲームを作っています。

回線が混雑している状況でボタンを2度押ししても1回しかカウントされないボタンを作りたいと考えています。

【基本的な知見】
下記であれば要望に沿ったボタンになります。(ボタンはCSS3の標準ボタンを使用)

<form action="form.cgi" method="post">
<input type="hidden" name="point" value="1" />
<SCRIPT TYPE="text/javascript">
<!--
//submitの2度押し防止
function disableButton(){
document.form1.button1.disabled = true;
submitForm();
}
function submitForm(){
document.form1.submit();
}
// -->
</SCRIPT>
<input type="button" value="購　入" onClick="disableButton()" name="button1">
</form>

【やりたいこと】
「ボタンに数量を表示したいことと、ボタン上の数値表記とCGIに渡すvalueが異なることがある」ため、CSS3の標準ボタンを止め下記のオリジナルCSSのボタンを使用します。

<button class="button8" type="submit" name="point" value="1050" onClick="disableButton()"><div>50ポイント</div></button>

このオリジナルCSSのボタンを使用した場合の2度押し防止のjavascriptはどのように改造すればいいか教えてください。
上記に示したjavascriptの 「document.form1.button1.disabled = true;」のbutton1をpointに変更したところ、数値をCGIに渡せませんでした。
よろしくお願いいたします。

回答No.1

DoubtOwl · ベストアンサー

function disableButton(){
submitForm();
document.form1.button1.disabled = true;
}

disabledは「無効」なので先にtrueにすると値が参照できません。

お礼

有難うございました。
助かりました。