JavaScript 给我 NaN，我不知道为什么。

huangapple
go评论100阅读模式
英文:

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):

  1. starteSpiel();
  3. function starteSpiel() {
  4.   var Punktzahl = 0;
  5.   document.getElementById("punktzahl").innerText = Punktzahl;
  6. }
  8. function sonderKarte(Punktzahl) {
  9. }
  11. function Mittelwert(Punktzahl) {
  12.   document.getElementById("MittelwertAusgabe").toggleAttribute("hidden");
  13. }
  15. function Chance(Punktzahl) {
  16.   document.getElementById("ChanceAusgabe").toggleAttribute("hidden");
  17. }
  19. function VollesHaus(Punktzahl) {
  20. }
  22. function KleineStraße(Punktzahl) {
  23.   var KleineStraßePunkte = 5;
  25.   Punktzahl += KleineStraßePunkte;
  26.   document.getElementById("punktzahl").innerText = Punktzahl;
  27. }
  29. function GroßeStraße(Punktzahl) {
  30. }
  32. function Gleiche3(Punktzahl) {
  33. }
  35. function Gleiche4(Punktzahl) {
  36. }
  38. function Gleiche5(Punktzahl) {
  39. }

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 -->

  1. starteSpiel();
  3. function starteSpiel() {
  4.   var Punktzahl = 0;
  5.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  6. }
  8. function sonderKarte(Punktzahl) {
  9. }
  11. function Mittelwert(Punktzahl) {
  12.   document.getElementById(&quot;MittelwertAusgabe&quot;).toggleAttribute (&quot;hidden&quot;);
  13. }
  14.         
  15. function Chance(Punktzahl) {
  16.   document.getElementById(&quot;ChanceAusgabe&quot;).toggleAttribute (&quot;hidden&quot;);
  17. }
  19. function VollesHaus(Punktzahl) {
  20. }
  22. function KleineStra&#223;e(Punktzahl) {
  23.   var KleineStra&#223;ePunkte = 5;
  25.   Punktzahl += KleineStra&#223;ePunkte;
  26.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  27. }
  29. function Gro&#223;eStra&#223;e(Punktzahl) {
  30. }
  32. function Gleiche3(Punktzahl) {
  33. }
  35. function Gleiche4(Punktzahl) {
  36. }
  38. function Gleiche5(Punktzahl) {
  39. }

<!-- language: lang-html -->

  1. &lt;!DOCTYPE html&gt;
  2. &lt;html lang=&quot;de&quot;&gt;
  4. &lt;head&gt;
  5.     &lt;meta charset=&quot;UTF-8&quot;&gt;
  6.     &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
  7.     &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
  8.     &lt;title&gt;TB_W&#252;rfelspiel&lt;/title&gt;
  9.     &lt;style&gt;
  10.         body {
  11.             background-color: black;
  12.             color: aliceblue;
  13.             margin-left: 5vh;
  14.         }
  16.         .buttonAussehen {
  17.             display: flex;
  18.             flex-direction: column;
  19.             margin-top: 5px;
  20.             font-size: 10px;
  21.         }
  22.         .PunkteAusgabe{
  23.             display: flex;
  24.             flex-direction: row;
  25.             font-size: 15px;
  26.         }
  27.     &lt;/style&gt;
  28. &lt;/head&gt;
  30. &lt;body&gt;
  31.     &lt;div&gt;
  32.         &lt;pre class=&quot;PunkteAusgabe&quot;&gt;Du hast &lt;span id=&quot;punktzahl&quot; class=&quot;PunkteAusgabe&quot;&gt;&lt;/span&gt; Punkte erreicht! &lt;/pre&gt;
  34.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;Mittelwert&quot; onclick=&quot;Mittelwert()&quot;&gt;Mittelwert&lt;/button&gt;
  35.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;Chance&quot; onclick=&quot;Chance()&quot;&gt;Chance&lt;/button&gt;
  36.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;VollesHaus&quot; onclick=&quot;VollesHaus()&quot;&gt;Volles Haus&lt;/button&gt;
  37.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;KleineStra&#223;e&quot; onclick=&quot;KleineStra&#223;e()&quot;&gt;Kleine Stra&#223;e&lt;/button&gt;
  38.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gro&#223;eStra&#223;e&quot; onclick=&quot;Gro&#223;eStra&#223;e()&quot;&gt;Gro&#223;e Stra&#223;e&lt;/button&gt;
  39.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gleiche3&quot; onclick=&quot;Gleiche3()&quot;&gt;3 Gleiche&lt;/button&gt;
  40.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gleiche4&quot; onclick=&quot;Gleiche4()&quot;&gt;4 Gleiche&lt;/button&gt;
  41.         &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gleiche5&quot; onclick=&quot;Gleiche5()&quot;&gt;5 Gleiche&lt;/button&gt;
  43.         &lt;br&gt;
  44.         &lt;br&gt;
  46.         &lt;div id=&quot;MittelwertAusgabe&quot; hidden&gt;
  47.         &lt;p id=&quot;ZahlErkl&#228;rungMittelwert&quot;&gt;Bitte gib den Mittelwert ein!&lt;/p&gt;
  48.         &lt;input type=&quot;number&quot; id=&quot;MittelwertZahl&quot;&gt;
  49.         &lt;/div&gt;
  51.         &lt;div id=&quot;ChanceAusgabe&quot; hidden&gt;
  52.         &lt;p id=&quot;ZahlErkl&#228;rungChance&quot;&gt;Bitte gib alle Augenzahlen ein!&lt;/p&gt;
  53.         &lt;input type=&quot;number&quot; id=&quot;ChanceZahl&quot;&gt;
  54.         &lt;/div&gt;
  56.     &lt;/div&gt;
  57. &lt;/body&gt;
  58. &lt;/html&gt;

<!-- 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

你有一个如下定义的函数：

  1. function KleineStra&#223;e(Punktzahl) {
  2.   var KleineStra&#223;ePunkte = 5;
  4.   Punktzahl += KleineStra&#223;ePunkte;
  5.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  6. }

然后你这样调用它：onclick=&quot;KleineStra&#223;e()&quot;

这个函数期望传递一个数字给它的 Punktzahl 参数，而你没有传递任何东西给它。

为了修复这个问题，你需要像这样传递你想要的值：onclick=&quot;KleineStra&#223;e(1)&quot;

然而，在阅读你的代码时，看起来你可能对函数内部变量的工作方式不太熟悉。你在一个函数内定义了一个变量，然后在所有其他函数的参数上都有相同的名称，尽管你给它们都取了相同的名称，但它们在任何方面都没有连接在一起。我认为你可能打算写类似这样的代码：

  1. // 在这里定义这个变量，以便所有函数都可以使用它
  2. var Punktzahl = 0;
  4. function starteSpiel() {
  5.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  6. }
  8. function sonderKarte() {
  9. }
  11. function Mittelwert() {
  12.   document.getElementById(&quot;MittelwertAusgabe&quot;).toggleAttribute (&quot;hidden&quot;);
  13. }
  15. function Chance() {
  16.   document.getElementById(&quot;ChanceAusgabe&quot;).toggleAttribute (&quot;hidden&quot;);
  17. }
  19. function VollesHaus() {
  20. }
  22. function KleineStra&#223;e() {
  23.   var KleineStra&#223;ePunkte = 5;
  25.   Punktzahl += KleineStra&#223;ePunkte;
  26.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  27. }
  29. function Gro&#223;eStra&#223;e() {
  30. }
  32. function Gleiche3() {
  33. }
  35. function Gleiche4() {
  36. }
  38. function Gleiche5() {
  39. }
  41. // 最后调用这个函数，以便在它之前所有的函数都已存在！
  42. starteSpiel();

这样的代码可以使你在不同的函数中共享相同的 Punktzahl 变量。

英文:

You have a function defined like this:

  1. function KleineStra&#223;e(Punktzahl) {
  2.   var KleineStra&#223;ePunkte = 5;
  4.   Punktzahl += KleineStra&#223;ePunkte;
  5.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  6. }

And then you call it like this onclick=&quot;KleineStra&#223;e()&quot;

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=&quot;KleineStra&#223;e(1)&quot;

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 -->

  1. //Define this variable out here so that all the functions can use it
  2. var Punktzahl = 0;
  4. function starteSpiel() {
  5.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  6. }
  8. function sonderKarte() {
  9. }
  11. function Mittelwert() {
  12.   document.getElementById(&quot;MittelwertAusgabe&quot;).toggleAttribute (&quot;hidden&quot;);
  13. }
  14.         
  15. function Chance() {
  16.   document.getElementById(&quot;ChanceAusgabe&quot;).toggleAttribute (&quot;hidden&quot;);
  17. }
  19. function VollesHaus() {
  20. }
  22. function KleineStra&#223;e() {
  23.   var KleineStra&#223;ePunkte = 5;
  25.   Punktzahl += KleineStra&#223;ePunkte;
  26.   document.getElementById(&quot;punktzahl&quot;).innerText = Punktzahl;
  27. }
  29. function Gro&#223;eStra&#223;e() {
  30. }
  32. function Gleiche3() {
  33. }
  35. function Gleiche4() {
  36. }
  38. function Gleiche5() {
  39. }
  41. //Call the function last, so that all the functions exist before it!
  42. starteSpiel();

<!-- language: lang-css -->

  1. body {
  2.     background-color: black;
  3.     color: aliceblue;
  4.     margin-left: 5vh;
  5. }
  7. .buttonAussehen {
  8.     display: flex;
  9.     flex-direction: column;
  10.     margin-top: 5px;
  11.     font-size: 10px;
  12. }
  13. .PunkteAusgabe{
  14.     display: flex;
  15.     flex-direction: row;
  16.     font-size: 15px;
  17. }

<!-- language: lang-html -->

  1. &lt;div&gt;
  2.     &lt;pre class=&quot;PunkteAusgabe&quot;&gt;Du hast &lt;span id=&quot;punktzahl&quot; class=&quot;PunkteAusgabe&quot;&gt;&lt;/span&gt; Punkte erreicht! &lt;/pre&gt;
  4.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;Mittelwert&quot; onclick=&quot;Mittelwert()&quot;&gt;Mittelwert&lt;/button&gt;
  5.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;Chance&quot; onclick=&quot;Chance()&quot;&gt;Chance&lt;/button&gt;
  6.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;VollesHaus&quot; onclick=&quot;VollesHaus()&quot;&gt;Volles Haus&lt;/button&gt;
  7.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;KleineStra&#223;e&quot; onclick=&quot;KleineStra&#223;e()&quot;&gt;Kleine Stra&#223;e&lt;/button&gt;
  8.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gro&#223;eStra&#223;e&quot; onclick=&quot;Gro&#223;eStra&#223;e()&quot;&gt;Gro&#223;e Stra&#223;e&lt;/button&gt;
  9.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gleiche3&quot; onclick=&quot;Gleiche3()&quot;&gt;3 Gleiche&lt;/button&gt;
  10.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gleiche4&quot; onclick=&quot;Gleiche4()&quot;&gt;4 Gleiche&lt;/button&gt;
  11.     &lt;button class=&quot;buttonAussehen&quot; id=&quot;Gleiche5&quot; onclick=&quot;Gleiche5()&quot;&gt;5 Gleiche&lt;/button&gt;
  13.     &lt;br&gt;
  14.     &lt;br&gt;
  16.     &lt;div id=&quot;MittelwertAusgabe&quot; hidden&gt;
  17.     &lt;p id=&quot;ZahlErkl&#228;rungMittelwert&quot;&gt;Bitte gib den Mittelwert ein!&lt;/p&gt;
  18.     &lt;input type=&quot;number&quot; id=&quot;MittelwertZahl&quot;&gt;
  19.     &lt;/div&gt;
  21.     &lt;div id=&quot;ChanceAusgabe&quot; hidden&gt;
  22.     &lt;p id=&quot;ZahlErkl&#228;rungChance&quot;&gt;Bitte gib alle Augenzahlen ein!&lt;/p&gt;
  23.     &lt;input type=&quot;number&quot; id=&quot;ChanceZahl&quot;&gt;
  24.     &lt;/div&gt;
  26. &lt;/div&gt;

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年4月11日 01:02:48
  • 转载请务必保留本文链接：https://go.coder-hub.com/75979073.html
  • css
  • html
  • javascript
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定