2017-02-03 3 views
0

ここに私のコードが付いています。ボタンが機能を果たし、リフレッシュするまですぐに無効にしてください。それはワンクリックで次のクリックの機能を追加するにはどうすればいいですか?

1つのボタンは他のいくつかのボタンを実行しているときに動作してはならない、これを行うと、私はそう実行するために、テーブルのサイズが異なるためにどのように助けてください

<html> 
    <head> 
    <script type="text/javascript"> 

       function boardSize(id, btnid) { 

      function hitheadr(id, btnid) { 

       return function() { 
        console.log(id); 
       }; 
       document.getElementByid(btnid).disabled=true; 
      }` 
      function createTable(rows, cols, element) { 
       function getButtonId(i, j) { 
        return 'hit' 
       } 
       var table = document.createElement('table'), 
        tr, td, button, i, j, 
        colors = ["red", "blue", "yellow"]; 

       for (i = 0; i < rows; i++) { 
        tr = document.createElement('tr'); 

        for (j = 0; j < cols; j++) { 
         td = document.createElement('td'); 
         button = document.createElement('button'); 
       button.style.backgroundColor =colors[Math.floor(Math.random() * colors.length)]; 
         button.appendChild(document.createTextNode(getButtonId(i, j))); 
         button.onclick = hitheadr(getButtonId(i, j)); 
         button.id = getButtonId(i, j); 
         button.onclick = onBtnClick; 

               button.id = getButtonId(i, j); 
         td.appendChild(button); 
         tr.appendChild(td); 
        } 
        table.appendChild(tr); 
        table.setAttribute("align", "center"); 
        tr.setAttribute("border", "2"); 
       } 
       element.appendChild(table); 
      } 

      createTable(3, 3, document.body); 
     } 

    </script> 
</head> 

答えて

0

このコードを使用すると、ボタンのクリックを無効にすることができます。 一度ボタンをクリックすると、このスクリプトはページを更新するまで次のボタンのクリックを無効にします。

  function boardSize(id, btnid) { 

     function hitheadr(id, btnid) { 

      return function() { 
       console.log(id); 
      }; 
      document.getElementByid(btnid).disabled=true; 
     }` 
     function createTable(rows, cols, element) { 
      function getButtonId(i, j) { 
       return 'hit' 
      } 
      var table = document.createElement('table'), 
       tr, td, button, i, j, 
       colors = ["red", "blue", "yellow"]; 

      for (i = 0; i < rows; i++) { 
       tr = document.createElement('tr'); 

       for (j = 0; j < cols; j++) { 
        td = document.createElement('td'); 
        button = document.createElement('button'); 
      button.style.backgroundColor =colors[Math.floor(Math.random() * colors.length)]; 
        button.appendChild(document.createTextNode(getButtonId(i, j))); 
        button.onclick = hitheadr(getButtonId(i, j)); 
        button.id = getButtonId(i, j); 
        button.onclick = onBtnClick; 

              button.id = getButtonId(i, j); 
        td.appendChild(button); 
        tr.appendChild(td); 
       } 
       table.appendChild(tr); 
       table.setAttribute("align", "center"); 
       tr.setAttribute("border", "2"); 
      } 
      element.appendChild(table); 
     } 

     createTable(3, 3, document.body); 
    } 

</script> 
関連する問題