按鈕不叫功能

-2

所以，我試圖做一個遊戲Candybox。我確實創建了一個獲取onclick屬性來調用函數的按鈕。按鈕不叫功能

if (AnzahlTP === 10) 
        { 
         var para = document.createElement("button"); 
         var node = document.createTextNode("Treuepunkte verschenken"); 
         para.appendChild(node); 

         var element = document.getElementById("haupt-div"); 
         element.appendChild(para); 

         var b1 = document.getElementsByTagName("button")[1]; //gibt dem Knopf eine Funktion 
         var att = document.createAttribute("onclick"); 

         att.value = "TPVerschenken()"; 
         b1.setAttributeNode(att); 
        }

Button應調用此函數，該函數將打印某些內容到頂部的p-Tag中。

function TPVerschenken() 
     { 
      AnzahlTPV = AnzahlTPV + AnzahlTP; 
      document.getElementById("TPVDisplay").innerHTML = "Verschenkte Treuepunkte: " + AnzahlVTP; 
      AnzahlTP = 0; 
     }

但是，如果按下按鈕，該功能不起作用，或不被調用。我檢查了onclick-attribute屬性給了這個按鈕。

這裏是整個代碼，如果需要的話。

<!DOCTYPE html> 
 
<html lang="de"> 
 
<head> 
 
    <link rel="stylesheet" type="text/css" href="spiel.css"/> 
 
    <meta charset="UTF-8"> 
 
    <title>Test, I guess...</title> 
 
</head> 
 
<body id="body"> 
 
    <div id="nav"> 
 

 
    </div> 
 

 
    <div id="haupt-div"> 
 
     <p id="TPDisplay"></p> 
 
     <p id="TPVDisplay"></p> 
 
     <button id="Knopf" onclick="TPSammelnKnopf()"> 
 
      Anfangen Treuepunkte zu sammeln 
 
     </button> 
 
     <script> 
 
      var TPSammeln = false; //Deklaration von Variablen am Anfang 
 
      var AnzahlTP = 0; 
 
      var AnzahlTPV = 0; 
 

 
      function TPSammelnKnopf() 
 
      { 
 
       if (!TPSammeln) 
 
       { 
 
        AnzahlTP++; 
 
        document.getElementById("TPDisplay").innerHTML = "Treuepunkte: " + AnzahlTP; //Damit dort direkt Text steht und er nicht erst erscheinen muss. 
 

 
        setInterval(function() 
 
        { 
 
         AnzahlTP++; 
 
         document.getElementById("TPDisplay").innerHTML = "Treuepunkte: " + AnzahlTP; 
 

 
         if (AnzahlTP === 10) 
 
         { 
 
          var para = document.createElement("button"); 
 
          var node = document.createTextNode("Treuepunkte verschenken"); 
 
          para.appendChild(node); 
 

 
          var element = document.getElementById("haupt-div"); 
 
          element.appendChild(para); 
 

 
          var b1 = document.getElementsByTagName("button")[1]; //gibt dem Knopf eine Funktion 
 
          var att = document.createAttribute("onclick"); 
 

 
          att.value = "TPVerschenken()"; 
 
          b1.setAttributeNode(att); 
 
         } 
 

 
         if (AnzahlTP === 80) 
 
         { 
 
          var para = document.createElement("button"); 
 
          var node = document.createTextNode("Shop freischalten"); 
 
          para.appendChild(node); 
 

 
          var element = document.getElementById("haupt-div"); 
 
          element.appendChild(para); 
 

 
          var b2 = document.getElementsByTagName("button")[2]; //gibt dem Knopf eine Funktion 
 
          var att = document.createAttribute("onclick"); 
 

 
          att.value = "Shop()"; 
 
          b2.setAttributeNode(att); 
 
         } 
 

 
        }, 1000); 
 
        TPSammeln = true; 
 

 
        var parent = document.getElementById("haupt-div"); 
 
        var child = document.getElementById("Knopf"); 
 
        parent.removeChild(child); 
 
       } 
 
      } 
 

 
      function TPVerschenken() 
 
      { 
 
       AnzahlTPV = AnzahlTPV + AnzahlTP; 
 
       document.getElementById("TPVDisplay").innerHTML = "Verschenkte Treuepunkte: " + AnzahlVTP; 
 
       AnzahlTP = 0; 
 
      } 
 

 
      function Shop() 
 
      { 
 

 
      } 
 
     </script> 
 
    </div> 
 
</body> 
 
</html>

來源

2015-10-14 Kikios

因爲'document.getElementsByTagName（「button」）[1]'返回'undefined'。檢查控制檯是否有錯誤... – Rayon

要設置onclick事件，可以通過JavaScript代碼創建的按鈕，你應該這樣做是這樣的：

para.onclick = (function() { 
    return function() { 
     TPVerschenken(); 
    }; 
})();

或者更簡單的，你可以使用：

para.addEventListener("click", TPVerschenken);

有關完整測試代碼，請c heck JsFiddle。

來源

2015-10-14 16:34:55 AnhTriet

現在正常工作，謝謝！ – Kikios

不客氣。請將此標記爲答案:) – AnhTriet

按鈕不叫功能

回答

相關問題