英文:
Javascript gives me NaN and I don't know why
问题
I would like the punktzahl to increase by 5 points when I click on "Kleine Straße (=button)" and I no longer get NaN as a punktzahl.
This is my Code (It's German):
starteSpiel();
function starteSpiel() {
var Punktzahl = 0;
document.getElementById("punktzahl").innerText = Punktzahl;
}
function sonderKarte(Punktzahl) {
}
function Mittelwert(Punktzahl) {
document.getElementById("MittelwertAusgabe").toggleAttribute("hidden");
}
function Chance(Punktzahl) {
document.getElementById("ChanceAusgabe").toggleAttribute("hidden");
}
function VollesHaus(Punktzahl) {
}
function KleineStraße(Punktzahl) {
var KleineStraßePunkte = 5;
Punktzahl += KleineStraßePunkte;
document.getElementById("punktzahl").innerText = Punktzahl;
}
function GroßeStraße(Punktzahl) {
}
function Gleiche3(Punktzahl) {
}
function Gleiche4(Punktzahl) {
}
function Gleiche5(Punktzahl) {
}
I'm developing my own dice game and don't know why I'm being issued NaN. I have searched the internet for 13 days and also asked Chat GPT, but I have not found anything that would have helped me.
I would be happy if someone could help me.
When the game comes out, the username of the person would be listed as the creator!
英文:
I would like the punktzahl to increase by 5 points when I click on "Kleine Straße (=button)" and I no longer get NaN as a punktzahl.
This is my Code (It's German):
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
starteSpiel();
function starteSpiel() {
var Punktzahl = 0;
document.getElementById("punktzahl").innerText = Punktzahl;
}
function sonderKarte(Punktzahl) {
}
function Mittelwert(Punktzahl) {
document.getElementById("MittelwertAusgabe").toggleAttribute ("hidden");
}
function Chance(Punktzahl) {
document.getElementById("ChanceAusgabe").toggleAttribute ("hidden");
}
function VollesHaus(Punktzahl) {
}
function KleineStraße(Punktzahl) {
var KleineStraßePunkte = 5;
Punktzahl += KleineStraßePunkte;
document.getElementById("punktzahl").innerText = Punktzahl;
}
function GroßeStraße(Punktzahl) {
}
function Gleiche3(Punktzahl) {
}
function Gleiche4(Punktzahl) {
}
function Gleiche5(Punktzahl) {
}
<!-- language: lang-html -->
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TB_Würfelspiel</title>
<style>
body {
background-color: black;
color: aliceblue;
margin-left: 5vh;
}
.buttonAussehen {
display: flex;
flex-direction: column;
margin-top: 5px;
font-size: 10px;
}
.PunkteAusgabe{
display: flex;
flex-direction: row;
font-size: 15px;
}
</style>
</head>
<body>
<div>
<pre class="PunkteAusgabe">Du hast <span id="punktzahl" class="PunkteAusgabe"></span> Punkte erreicht! </pre>
<button class="buttonAussehen" id="Mittelwert" onclick="Mittelwert()">Mittelwert</button>
<button class="buttonAussehen" id="Chance" onclick="Chance()">Chance</button>
<button class="buttonAussehen" id="VollesHaus" onclick="VollesHaus()">Volles Haus</button>
<button class="buttonAussehen" id="KleineStraße" onclick="KleineStraße()">Kleine Straße</button>
<button class="buttonAussehen" id="GroßeStraße" onclick="GroßeStraße()">Große Straße</button>
<button class="buttonAussehen" id="Gleiche3" onclick="Gleiche3()">3 Gleiche</button>
<button class="buttonAussehen" id="Gleiche4" onclick="Gleiche4()">4 Gleiche</button>
<button class="buttonAussehen" id="Gleiche5" onclick="Gleiche5()">5 Gleiche</button>
<br>
<br>
<div id="MittelwertAusgabe" hidden>
<p id="ZahlErklärungMittelwert">Bitte gib den Mittelwert ein!</p>
<input type="number" id="MittelwertZahl">
</div>
<div id="ChanceAusgabe" hidden>
<p id="ZahlErklärungChance">Bitte gib alle Augenzahlen ein!</p>
<input type="number" id="ChanceZahl">
</div>
</div>
</body>
</html>
<!-- end snippet -->
I'm developing my own dice game and don't know why I'm being issued NaN.
I have searched the internet for 13 days and also asked Chat GPT, but I have not found anything that would have helped me.
I would be happy if someone could help me.
When the game comes out, the username of the person would be listed as the creator!
答案1
得分: 0
你有一个如下定义的函数：
function KleineStraße(Punktzahl) {
var KleineStraßePunkte = 5;
Punktzahl += KleineStraßePunkte;
document.getElementById("punktzahl").innerText = Punktzahl;
}
然后你这样调用它：onclick="KleineStraße()"
这个函数期望传递一个数字给它的 Punktzahl 参数，而你没有传递任何东西给它。
为了修复这个问题，你需要像这样传递你想要的值：onclick="KleineStraße(1)"
然而，在阅读你的代码时，看起来你可能对函数内部变量的工作方式不太熟悉。你在一个函数内定义了一个变量，然后在所有其他函数的参数上都有相同的名称，尽管你给它们都取了相同的名称，但它们在任何方面都没有连接在一起。我认为你可能打算写类似这样的代码：
// 在这里定义这个变量，以便所有函数都可以使用它
var Punktzahl = 0;
function starteSpiel() {
document.getElementById("punktzahl").innerText = Punktzahl;
}
function sonderKarte() {
}
function Mittelwert() {
document.getElementById("MittelwertAusgabe").toggleAttribute ("hidden");
}
function Chance() {
document.getElementById("ChanceAusgabe").toggleAttribute ("hidden");
}
function VollesHaus() {
}
function KleineStraße() {
var KleineStraßePunkte = 5;
Punktzahl += KleineStraßePunkte;
document.getElementById("punktzahl").innerText = Punktzahl;
}
function GroßeStraße() {
}
function Gleiche3() {
}
function Gleiche4() {
}
function Gleiche5() {
}
// 最后调用这个函数，以便在它之前所有的函数都已存在！
starteSpiel();
这样的代码可以使你在不同的函数中共享相同的 Punktzahl 变量。
英文:
You have a function defined like this:
function KleineStraße(Punktzahl) {
var KleineStraßePunkte = 5;
Punktzahl += KleineStraßePunkte;
document.getElementById("punktzahl").innerText = Punktzahl;
}
And then you call it like this onclick="KleineStraße()"
That function is expecting a number to be passed to it with the Punktzahl parameter, and you aren't passing anything to it.
To fix this you need to pass the value you want, like this: onclick="KleineStraße(1)"
However, reading over your code, it looks like you may be new to how variables work inside functions. You have a variable defined inside one function, and then you have a parameter on all other functions with the same name, these are not connected in any way even though you named them the same thing. I think something like this might be what you intended to write:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
//Define this variable out here so that all the functions can use it
var Punktzahl = 0;
function starteSpiel() {
document.getElementById("punktzahl").innerText = Punktzahl;
}
function sonderKarte() {
}
function Mittelwert() {
document.getElementById("MittelwertAusgabe").toggleAttribute ("hidden");
}
function Chance() {
document.getElementById("ChanceAusgabe").toggleAttribute ("hidden");
}
function VollesHaus() {
}
function KleineStraße() {
var KleineStraßePunkte = 5;
Punktzahl += KleineStraßePunkte;
document.getElementById("punktzahl").innerText = Punktzahl;
}
function GroßeStraße() {
}
function Gleiche3() {
}
function Gleiche4() {
}
function Gleiche5() {
}
//Call the function last, so that all the functions exist before it!
starteSpiel();
<!-- language: lang-css -->
body {
background-color: black;
color: aliceblue;
margin-left: 5vh;
}
.buttonAussehen {
display: flex;
flex-direction: column;
margin-top: 5px;
font-size: 10px;
}
.PunkteAusgabe{
display: flex;
flex-direction: row;
font-size: 15px;
}
<!-- language: lang-html -->
<div>
<pre class="PunkteAusgabe">Du hast <span id="punktzahl" class="PunkteAusgabe"></span> Punkte erreicht! </pre>
<button class="buttonAussehen" id="Mittelwert" onclick="Mittelwert()">Mittelwert</button>
<button class="buttonAussehen" id="Chance" onclick="Chance()">Chance</button>
<button class="buttonAussehen" id="VollesHaus" onclick="VollesHaus()">Volles Haus</button>
<button class="buttonAussehen" id="KleineStraße" onclick="KleineStraße()">Kleine Straße</button>
<button class="buttonAussehen" id="GroßeStraße" onclick="GroßeStraße()">Große Straße</button>
<button class="buttonAussehen" id="Gleiche3" onclick="Gleiche3()">3 Gleiche</button>
<button class="buttonAussehen" id="Gleiche4" onclick="Gleiche4()">4 Gleiche</button>
<button class="buttonAussehen" id="Gleiche5" onclick="Gleiche5()">5 Gleiche</button>
<br>
<br>
<div id="MittelwertAusgabe" hidden>
<p id="ZahlErklärungMittelwert">Bitte gib den Mittelwert ein!</p>
<input type="number" id="MittelwertZahl">
</div>
<div id="ChanceAusgabe" hidden>
<p id="ZahlErklärungChance">Bitte gib alle Augenzahlen ein!</p>
<input type="number" id="ChanceZahl">
</div>
</div>
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论