由于某種原因，網站中的按鈕不會像其他2個應該做類似事情的按鈕一樣乘以一個值

我正在制作我的第一個網站。

第一個按鈕將一個添加到底部的數字，第二個按鈕將添加的數量乘以 2，第三個按鈕應該乘以乘數，但由于某種原因它不起作用。如果有人能指出我的代碼中的錯誤，那就太好了！我也很抱歉這個非常不專業的網站，我只是想把它變成我自己。

let numy = 0
increment = 1
multy = 2
multym = 2

function changeColor() {
  window.alert("downloading virus");
}

function adNum() {
  numy  = increment
  document.getElementById("num").innerHTML = numy;
}

function multiply() {
  increment *= multy
  document.getElementById("earn").innerHTML = "press for earn "   increment;
}

function multy() {
  multy *= multym
  document.getElementById("multiplym").innerHTML = "multiply asmdfmasdfams by "   multym;
}

body {
  background-color: powderblue;
}

body {
  background-image: url("bigboiwater.jpg");
}

h1,
h2,
h3,
h4,
h5 {
  color: red;
}

img {
  max-width: 100%;
  max-height: 100%;
}

.water {
  height: 20px;
  cursor: pointer;
  margin: 0 auto;
}

#earn {}

#mulity {}

#multym
}
{}
.ih {
  left: 1px;
  width: 100px
}
.button {
  margin: 0 auto;
}
#num {
  font-size: 50;
  color: pink;
}

<title>you should drink water</title>
<link rel="icon" href="troll.png" />
<div class="ih" style="cursor:progress" ;>
  <h1 style="cursor:wait;">Water!</h1>
  <h2 style="cursor:crosshair" ;>Water!</h2>
  <h3 style="cursor:alias" ;>Water</h3>
  <h4 style="cursor:not-allowed" ;>Water</h4>
  <h5 style="cursor:zoom-in" ;>Water</h5>
  <img src="troll.png">
  <div class="water" ;><button onclick="changeColor()" ;><img src="Click-Here-PNG-Images.png"></button> </div>
</div>

<div>
  <button onclick="adNum()" class="button">
      <p id="earn">press for earn 1</p>
    </button>
  <button onclick="multiply()" class="button">
      <p id="multiply">multiply earn by 2</p>
    </button>
  <button onclick="multy()" class="button">
      <p id="multiplym">multiply multiply by 2</p>
    </button>
</div>
<p id="num">hi</p>
<div style="background-color:pink"><label for="Name">Whats your problem:</label><input type="text" id="Name" name="Name" placeholder="I am kinda stupid"></div>

uj5u.com熱心網友回復：

你讓multy成為一個全域變數。將函式名稱更改為 multy1

let numy = 0
increment = 1
multy = 2
multym = 2

function changeColor() {
  window.alert("downloading virus");
}

function adNum() {
  numy  = increment
  document.getElementById("num").innerHTML = numy;
}

function multiply() {
  increment *= multy
  document.getElementById("earn").innerHTML = "press for earn "   increment;
}

function multy1() {
console.log("hello")
  
  document.getElementById("multiplym").innerHTML = "multiply asmdfmasdfams by "   multym;
}

body {
  background-color: powderblue;
}

body {
  background-image: url("bigboiwater.jpg");
}

h1,
h2,
h3,
h4,
h5 {
  color: red;
}

img {
  max-width: 100%;
  max-height: 100%;
}

.water {
  height: 20px;
  cursor: pointer;
  margin: 0 auto;
}

#earn {}

#mulity {}

#multym
}
{}
.ih {
  left: 1px;
  width: 100px
}
.button {
  margin: 0 auto;
}
#num {
  font-size: 50;
  color: pink;
}

<title>you should drink water</title>
<link rel="icon" href="troll.png" />
<div class="ih" style="cursor:progress" ;>
  <h1 style="cursor:wait;">Water!</h1>
  <h2 style="cursor:crosshair" ;>Water!</h2>
  <h3 style="cursor:alias" ;>Water</h3>
  <h4 style="cursor:not-allowed" ;>Water</h4>
  <h5 style="cursor:zoom-in" ;>Water</h5>
  <img src="troll.png">
  <div class="water" ;><button onclick="changeColor()" ;><img src="Click-Here-PNG-Images.png"></button> </div>
</div>

<div>
  <button onclick="adNum()" class="button">
      <p id="earn">press for earn 1</p>
    </button>
  <button onclick="multiply()" class="button">
      <p id="multiply">multiply earn by 2</p>
    </button>
  <button onclick="multy1()" class="button">
      <p id="multiplym">multiply multiply by 2</p>
    </button>
</div>
<p id="num">hi</p>
<div style="background-color:pink"><label for="Name">Whats your problem:</label><input type="text" id="Name" name="Name" placeholder="I am kinda stupid"></div>

uj5u.com熱心網友回復：

您有一個函式和一個變數 - 都稱為multy. 如果您重命名其中任何一個，問題應該會得到解決。下面，變數已重命名為multiplier.

let numy = 0;
increment = 1;
multiplier = 2;
multym = 2;

function changeColor() {
  window.alert("downloading virus");
}

function adNum() {
  numy  = increment;
  document.getElementById("num").innerHTML = numy;
}

function multiply() {
  increment *= multiplier;
  document.getElementById("earn").innerHTML = "press for earn "   increment;
}

function multy() {
  multiplier *= multym;
  document.getElementById("multiply").innerHTML = "multiply earn by "   multiplier;
  document.getElementById("multiplym").innerHTML = "multiply asmdfmasdfams by "   multym;
}

body {
  background-color: powderblue;
}

body {
  background-image: url("bigboiwater.jpg");
}

h1,
h2,
h3,
h4,
h5 {
  color: red;
}

img {
  max-width: 100%;
  max-height: 100%;
}

.water {
  height: 20px;
  cursor: pointer;
  margin: 0 auto;
}

#earn {}

#mulity {}

#multym
}
{}
.ih {
  left: 1px;
  width: 100px
}
.button {
  margin: 0 auto;
}
#num {
  font-size: 50;
  color: pink;
}

<title>you should drink water</title>
<link rel="icon" href="troll.png" />
<div class="ih" style="cursor:progress" ;>
  <h1 style="cursor:wait;">Water!</h1>
  <h2 style="cursor:crosshair" ;>Water!</h2>
  <h3 style="cursor:alias" ;>Water</h3>
  <h4 style="cursor:not-allowed" ;>Water</h4>
  <h5 style="cursor:zoom-in" ;>Water</h5>
  <img src="troll.png">
  <div class="water" ;><button onclick="changeColor()" ;><img src="Click-Here-PNG-Images.png"></button> </div>
</div>

<div>
  <button onclick="adNum()" class="button">
      <p id="earn">press for earn 1</p>
    </button>
  <button onclick="multiply()" class="button">
      <p id="multiply">multiply earn by 2</p>
    </button>
  <button onclick="multy()" class="button">
      <p id="multiplym">multiply multiply by 2</p>
    </button>
</div>
<p id="num">hi</p>
<div style="background-color:pink"><label for="Name">Whats your problem:</label><input type="text" id="Name" name="Name" placeholder="I am kinda stupid"></div>

（我還在函式中添加了一行，以便更改反映在中間按鈕文本中。）

標籤：javascripthtmlcss

上一篇：html使2個雙行文本的行間距相同

下一篇：HibernateReactive-在迭代父物體期間獲取子關聯的最佳實踐