2016-01-16 53 views
0

我做一個無限的遊戲,我想算clickings。我嘗試了一切,但都沒有奏效。我是編程的首選,但我現在喜歡它。請有人幫助我!這是代碼(2兩件事:1.對不起,我的英文不好,我想最好的方式複製代碼2.但這並不表明寄託都):HTML按鈕命中計數

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
     <style type=text/css> 
      .button { 
       background-color: red; 
       float: center; 
       width: 200px; 
       height: 200px; 
       margin-left: auto; 
       margin-right: auto; 
       display: block; 
       margin-top: 300px; 
       margin-bottom: 0%; 
      } 

      .body { 
       background-color: yellow; 
      } 

     </style> 
    </head> 

    <body class="body" id="body"> 
     <button onclick="myFunction()" class="button" style="font-size:50px" ; id="gomb">Nyomj meg!</button> 
     <script> 
      var count = 0; 
      var a = true; 
      var gomb = document.getElementById("gomb"); 
      var body = document.getElementById("body"); 

      gomb.onclick = function() { 
       if (a == true) { 
        gomb.style.background = "yellow"; 
        gomb.innerHTML = "Na még egyszer!"; 
        body.style.background = "red"; 
        a = false; 
       } else { 
        gomb.style.background = "red"; 
        body.style.background = "yellow"; 
        a = true; 
       } 
      }; 

      function myFunction() { 
       if (count == 5) { 
        gomb.style.display = "none" 
       } else { 
        count = count + 1; 
       }; 
      } 
     </script> 
    </body> 
</html> 
+0

那麼是什麼問題,是不是正在顯示的計?計數不正確遞增?你期望的結果是什麼? – Andrew

回答

0

嘗試更改代碼:

window.addEventListener:這有助於您重新安排代碼,以便在加載頁面時分配事件點擊和變量。

使用的addEventListener附加一個事件到HTML元素

這是unusefull給一個id和名稱的身體。

var count = 0; 
 
var a = true; 
 
var gomb; 
 
var body; 
 

 
window.addEventListener('load', function(e) { 
 
    gomb = document.getElementById("gomb"); 
 
    body = document.getElementsByTagName('body')[0]; 
 

 
    gomb.addEventListener('click', function(e) { 
 
    if (a==true){ 
 
     gomb.style.background = "yellow"; 
 
     gomb.innerHTML="Na még egyszer!"; 
 
     body.style.background = "red"; 
 
     a = false; 
 
    } 
 
    else 
 
    { 
 
     gomb.style.background = "red"; 
 
     body.style.background = "yellow"; 
 
     a = true; 
 
    } 
 
    }); 
 
}); 
 

 
function myFunction(){ 
 
    if(count==5) { 
 
    gomb.style.display="none" 
 
    } 
 
    else 
 
    { 
 
    count=count+1; 
 
    }; 
 
}
.button{ 
 
    background-color:red; 
 
    float: center; 
 
    width: 200px; 
 
    height: 200px; 
 
    margin-left:auto; 
 
    margin-right:auto; 
 
    display:block; 
 
    margin-top:300px; 
 
    margin-bottom:0%; 
 
} 
 
body{ 
 
    background-color: yellow; 
 
}
<button onclick="myFunction()" class="button" style="font-size:50px"; id="gomb">Nyomj meg!</button>