自分は今、Javascriptでスロットマシンを作っています。
そこで質問なんですが、スタートボタンを連打しますとリールの回転が速くなってしまいます。
回転速度は一定のままにしたいです。
そしてアタリ、ハズレの判定が消えません。
どうしたらよろしいでしょうか。
よろしくお願いします。

Javascript

//左リールの制御
function a1() {

    //aにHTMLから取得した数字を代入
    var a=document.getElementById("su1").innerHTML;

    //文字列のiを数字に変換し１を足してxに代入
    var x=parseInt(a)+1;

    //取得した値が９を超えたら１に戻す
    if(x>9) {
    x=1;
    }
    //xに書き換えてして表示する
    document.getElementById("su1").innerHTML=x;

    //一定期間繰り返す
    TimeoutID1=setTimeout("a1()",100);
    }





    //スタートボタンを押すと６を表示する
    function rstart() {
     a2();
     a1();
     a3();
    }

//真ん中のリールの制御
function a2() {

    //iにHTMLから取得した数字を代入
    var i=document.getElementById("su2").innerHTML;

    //文字列のiを数字に変換し１を足してjに代入
    var j=parseInt(i)+1;

    //取得した値が９を超えたら１に戻す
    if(j>9) {
     j=1;
    }

    //Jに書き換えてして表示する
    document.getElementById("su2").innerHTML=j;

    //一定期間繰り返す
    TimeoutID2=setTimeout("a2()",100);
    }



//右のリールの制御
function a3() {
    var c=document.getElementById("su3").innerHTML;

    //文字列のiを数字に変換し１を足してjに代入

    var z=parseInt(c)+1;
     if(z>9) {
     z=1;
    }

    //zに書き換えてして表示する
    document.getElementById("su3").innerHTML=z;

    //一定期間繰り返す
    TimeoutID3=setTimeout("a3()",100);

    }

//三つのリールを止める
 function stop(btn) {
    if(btn == 0) {clearTimeout(TimeoutID1);TimeoutID1=0;}
    if(btn == 1) {clearTimeout(TimeoutID2);TimeoutID2=0;}
    if(btn == 2) {clearTimeout(TimeoutID3);TimeoutID3=0;}

    //su1,su2,su3の値が同じなら"skekka"にあたりを表示、それ以外ならはずれを表示
    if(!(TimeoutID1 | TimeoutID2 | TimeoutID3)){
    if(document.getElementById("su1").innerHTML == document.getElementById("su2").innerHTML
    && document.getElementById("su2").innerHTML == document.getElementById("su3").innerHTML){
    document.getElementById("skekka").innerHTML="あたり";
    }else{
    document.getElementById("skekka").innerHTML="はずれ";
    }
    }
    }

HTML

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <script type="text/javascript" src="sample1.js"></script>
  </head>
  <body>
   <form name="game">
    <style type="text/css">
    <!--
    .surot{text-align:center;font-size:38;font-weight:bold;color:#ff0000;width:90;height:65;background-color:#0000ff;}
    .surot2{font-size:14pt;font-weight:bold;color:#0000ff;text-align:center;width:96;}
-->
    -->
    </style>
    <p style="text-align:center;font-size:24pt;font-weight:bold;">スロットマシン</p>
    <table border="0" style="margin-left:150;margin-bottom:0;">
      <tr>
        <td id="skekka" style="font-size:34;font-weight:bold;color:#ff0000;width:200;height:40;text-align:center;"></td>
      </tr>
    </table>
    <table style="background-color:#00ff00;border:solid #00ff00 5;margin-left:100;margin-bottom:0;">
      <tr>
        <td id="su1" class="surot">0<td>
        <td id="su2" class="surot">0<td>
        <td id="su3" class="surot">0<td>
      </tr>
    </table>
    <table style="margin-left:100;">
      <tr>
        <td><input type="button" value="ストップ" onClick="stop(0)" class="surot2"></td>
        <td><input type="button" value="ストップ" onClick="stop(1)" class="surot2"></td>
        <td><input type="button" value="ストップ" onClick="stop(2)" class="surot2"></td>
      </tr>
    </table>
    <div style="position:absolute;top:125;left:450;" >
      <input type="button" value="スタート" onClick="rstart()" style="font-size:16pt;font-weight:bold;color:#0000ff;">
    </div>
   </form>
  </body>
</html>