1. ホーム
  2. 質問と答え
  3. jQuery Onclick関数が複数回発火しています

jQuery Onclick関数が複数回発火しています

2017-10-31 7 views
2

コードがありますので、table rowをtable cellに追加するには、buttonをクリックするたびにコードを追加します。私が最初にクリックすると、ちょうどそれが想定されているようにrowが1つ追加されます。しかし、もう一度クリックすると、rowが2つ追加され、次にrowが3つ追加され、次にが表示されます。jQuery Onclick関数が複数回発火しています

これはなぜ起こっているのか、どのように修正できるのでしょうか。コード：することになっているように、コードを表示するページ全体結果でそれを行うに

var webnetPriceChange; 
 
var cloneCorpPriceChange; 
 
var cityBankPriceChange; 
 
var herbmartPriceChange; 
 
var digitalSystemsPriceChange; 
 
var nationalAirlinesPriceChange; 
 
var statePowerPriceChange; 
 
var parklandPriceChange; 
 
var priceSet; 
 
var stocks = -1; 
 
$(function() { 
 
    // update color of totalMoney 
 
    setInterval(function() { 
 
     var totalMoney = parseInt($("#purchaseStockMoneyAfterPrice").text()); 
 
     if (totalMoney > 0) { 
 
      $("#purchaseStockMoneyAfterPrice").css("color", "green"); 
 
     } 
 
     else { 
 
      $("#purchaseStockMoneyAfterPrice").css("color", "darkRed"); 
 
     } 
 
    }, 1); 
 
    $("#purchaseStockButton").click(function() { 
 
     stocks++; 
 
     $("#purchaseStockSelect").val("Webnet"); 
 
     var webnetActivated = true; 
 
     var cloneCorpActivated = false; 
 
     var flipPurchaseStockAnimation = $("#purchaseStockBox"); 
 
     var entireTable = $("#entireTable"); 
 
     var webnetPrice = parseInt($("#webnetPrice").text()); 
 
     var cloneCorpPrice = parseInt($("#cloneCorpPrice").text()); 
 
     var money = parseInt($("#money").text()); 
 
     $("#purchaseStockMoneyAfterPrice").text(money); 
 
     var totalMoney = parseInt($("#purchaseStockMoneyAfterPrice").text()); 
 
     $("#numberPurchaseStock").val("100"); 
 
     var numberPurchaseStock = $("#numberPurchaseStock").val(); 
 
     var cost; 
 
     var moneyLeft; 
 
     $("#flipBlueCardBox").hide(); 
 
     entireTable.animate({ 
 
      opacity: 0, 
 
     }, 1000); 
 
     flipPurchaseStockAnimation.animate({ 
 
      top: "+=200px" 
 
     }, 0); 
 
     flipPurchaseStockAnimation.animate({ 
 
      opacity: 1 
 
     }, 1000); 
 
     // change price upon changing stock 
 
     $("#purchaseStockSelect").change(function() { 
 
      var purchaseStockSelected = $("#purchaseStockSelect").val(); 
 
      if (purchaseStockSelected == "Webnet") { 
 
       webnetActivated = true; 
 
       cloneCorpActivated = false; 
 
      } 
 
      else if (purchaseStockSelected === "Clone Corp") { 
 
       cloneCorpActivated = true; 
 
       webnetActivated = false; 
 
      } 
 
     }); 
 
     setInterval(function() { 
 
      var numberPurchaseStock = $("#numberPurchaseStock").val(); 
 
      if (webnetActivated === true) { 
 
       cost = webnetPrice * numberPurchaseStock; 
 
      } 
 
      else if (cloneCorpActivated === true) { 
 
       cost = cloneCorpPrice * numberPurchaseStock; 
 
      } 
 
      moneyLeft = totalMoney - cost; 
 
      $("#purchaseStockPrice").text(cost); 
 
      $("#purchaseStockMoneyAfterPrice").text(moneyLeft); 
 
     }, 1); 
 
     // update stocks table 
 
     $("#numberPurchaseStockButton").click(function() { 
 
      var totalMoney = parseInt($("#purchaseStockMoneyAfterPrice").text()); 
 
      if (totalMoney >= 0) { 
 
       var flipPurchaseStockAnimation = $("#purchaseStockBox"); 
 
       var entireTable = $("#entireTable"); 
 
       var numberPurchaseStock = $("#numberPurchaseStock").val() 
 
       var purchaseStockSelected = $("#purchaseStockSelect").val(); 
 
       if (purchaseStockSelected == "Webnet") { 
 
        priceSet = webnetPrice; 
 
       } 
 
       else if (purchaseStockSelected == "Clone Corp") { 
 
        priceSet = cloneCorpPrice; 
 
       } 
 
       $("#yourStockTableHeader").after('<tr><td id = "stockAmount' + stocks + '">' + numberPurchaseStock + '</td><td id = "stockType' + stocks + '">' + purchaseStockSelected + '</td><td id = "stockPurchaseCost' + stocks + '">' + cost + '</td><td id = "stockSellPrice' + stocks + '">' + priceSet + '</td></tr>'); 
 
       cost = 0; 
 
       entireTable.animate({ 
 
        opacity: 1 
 
       }, 1000); 
 
       flipPurchaseStockAnimation.animate({ 
 
        opacity: 0 
 
       }, 1000); 
 
       $("#flipBlueCardBox").show(); 
 
       var webnetActivated = false; 
 
       var cloneCorpActivated = false; 
 
      } 
 
      else { 
 
       alert("You do not have enough money!"); 
 
      } 
 
     }); 
 
    }); 
 
    // Creates animation after button click 
 
    $("#flipABlueCard").click(function() { 
 
     var flipABlueCardAnimation = $("#flipBlueCardBox"); 
 
     var entireTable = $("#entireTable"); 
 
     entireTable.animate({ 
 
      opacity: 0 
 
     }, 1000); 
 
     $("#purchaseStockBox").hide(); 
 
     flipABlueCardAnimation.animate({ 
 
      opacity: 1 
 
     }, 1000); 
 
    }); 
 
    // Sets the values after having clicked the button 
 
    $("#numberBlueCardButton").click(function() { 
 
     var numberBlueCardValue = $("#numberBlueCard").val(); 
 
     var entireTable = $("#entireTable"); 
 
     var flipABlueCardAnimation = $("#flipBlueCardBox"); 
 
     entireTable.animate({ 
 
      opacity: 1 
 
     }, 1000); 
 
     flipABlueCardAnimation.animate({ 
 
      opacity: 0 
 
     }, 1000); 
 
     $("#purchaseStockBox").show(); 
 
     if (numberBlueCardValue == 1) { 
 
      webnetPriceChange = 12; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      cityBankPriceChange = 10; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      digitalSystemsPriceChange = 17; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      nationalAirlinesPriceChange = 5; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 2) { 
 
      cloneCorpPriceChange = 12; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      digitalSystemsPriceChange = 20; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      statePowerPriceChange = 15; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
      parklandPriceChange = 10; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 3) { 
 
      webnetPriceChange = 15; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      digitalSystemsPriceChange = 18; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      nationalAirlinesPriceChange = 8; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      statePowerPriceChange = 20; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 4) { 
 
      webnetPriceChange = 9; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      cloneCorpPriceChange = 9; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 14; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 19; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 5) { 
 
      webnetPriceChange = 6; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      cloneCorpPriceChange = 17; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      nationalAirlinesPriceChange = 9; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      statePowerPriceChange = 14; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 6) { 
 
      webnetPriceChange = 16; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      herbmartPriceChange = 12; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      digitalSystemsPriceChange = 22; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      statePowerPriceChange = 16; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 7) { 
 
      herbmartPriceChange = 10; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      digitalSystemsPriceChange = 12; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      statePowerPriceChange = 19; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
      parklandPriceChange = 16; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 8) { 
 
      cloneCorpPriceChange = 15; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 17; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 11; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      parklandPriceChange = 15; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 9) { 
 
      cloneCorpPriceChange = 14; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 11; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 13; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      parklandPriceChange = 17; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 10) { 
 
      webnetPriceChange = 13; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      cityBankPriceChange = 16; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 14; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      statePowerPriceChange = 11; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 11) { 
 
      cloneCorpPriceChange = 13; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 20; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 18; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      nationalAirlinesPriceChange = 15; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 12) { 
 
      webnetPriceChange = 8; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      cloneCorpPriceChange = 11; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      digitalSystemsPriceChange = 19; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      nationalAirlinesPriceChange = 11; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 13) { 
 
      webnetPriceChange = 7; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      digitalSystemsPriceChange = 16; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      statePowerPriceChange = 12; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
      parklandPriceChange = 12; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 14) { 
 
      webnetPriceChange = 11; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      cityBankPriceChange = 13; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 16; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      digitalSystemsPriceChange = 21; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 15) { 
 
      webnetPriceChange = 10; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      cloneCorpPriceChange = 10; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      digitalSystemsPriceChange = 13; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      statePowerPriceChange = 13; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 16) { 
 
      herbmartPriceChange = 15; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      nationalAirlinesPriceChange = 12; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      statePowerPriceChange = 17; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
      parklandPriceChange = 11; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 17) { 
 
      digitalSystemsPriceChange = 14; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      nationalAirlinesPriceChange = 13; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      statePowerPriceChange = 18; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
      parklandPriceChange = 14; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 18) { 
 
      cloneCorpPriceChange = 16; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 12; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 9; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      nationalAirlinesPriceChange = 7; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 19) { 
 
      cloneCorpPriceChange = 8; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 19; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      nationalAirlinesPriceChange = 10; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      parklandPriceChange = 13; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 19) { 
 
      cloneCorpPriceChange = 8; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 19; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      nationalAirlinesPriceChange = 10; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      parklandPriceChange = 13; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 20) { 
 
      cityBankPriceChange = 18; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      herbmartPriceChange = 17; 
 
      $("#herbmartPrice").text(herbmartPriceChange); 
 
      statePowerPriceChange = 21; 
 
      $("#statePowerPrice").text(statePowerPriceChange); 
 
      parklandPriceChange = 8; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 21) { 
 
      webnetPriceChange = 14; 
 
      $("#webnetPrice").text(webnetPriceChange); 
 
      digitalSystemsPriceChange = 15; 
 
      $("#digitalSystemsPrice").text(digitalSystemsPriceChange); 
 
      nationalAirlinesPriceChange = 6; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      parklandPriceChange = 9; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else if (numberBlueCardValue == 22) { 
 
      cloneCorpPriceChange = 7; 
 
      $("#cloneCorpPrice").text(cloneCorpPriceChange); 
 
      cityBankPriceChange = 15; 
 
      $("#cityBankPrice").text(cityBankPriceChange); 
 
      nationalAirlinesPriceChange = 14; 
 
      $("#nationalAirlinesPrice").text(nationalAirlinesPriceChange); 
 
      parklandPriceChange = 18; 
 
      $("#parklandPrice").text(parklandPriceChange); 
 
     } 
 
     else { 
 
      alert("An invalid card number was entered"); 
 
     } 
 
    }); 
 
});
body { 
 
    background-color: cornflowerblue; 
 
} 
 
#entireTable { 
 
    position: static; 
 
    display: table; 
 
} 
 
.title { 
 
    display: inline-block; 
 
    white-space: pre-wrap; 
 
    color: blanchedalmond; 
 
} 
 
table { 
 
    border-collapse: collapse; 
 
    background-color: white; 
 
    display: inline-block; 
 
} 
 
#yourStockTable { 
 
    height: 280px; 
 
} 
 
#yourMoneyTable { 
 
    height: 280px; 
 
    width: 280px; 
 
} 
 
#moneyTab { 
 
    white-space: pre-wrap; 
 
} 
 
th, td { 
 
    border: 1.5px solid darkgray; 
 
    text-align: center; 
 
    padding: 6px; 
 
} 
 
#purchaseStockButton, #sellStockButton, #flipABlueCard, #flipANewsCard { 
 
    width: 180px; 
 
    height: 30px; 
 
    border: 1.5px solid darkgray; 
 
} 
 
#purchaseStockButton { 
 
    background-color: darkolivegreen; 
 
} 
 
#sellStockButton { 
 
    background-color: brown; 
 
} 
 
#flipABlueCard { 
 
    background-color: skyblue; 
 
} 
 
#flipANewsCard { 
 
    background-color: coral; 
 
} 
 
#purchaseStockButton:hover, #sellStockButton:hover, #flipABlueCard:hover, #flipANewsCard:hover { 
 
    cursor: pointer; 
 
} 
 
#flipBlueCardBox, #purchaseStockBox { 
 
    opacity: 0; 
 
} 
 
#numberBlueCard { 
 
    width: 40px; 
 
} 
 
#numberPurchaseStock { 
 
    width: 65px; 
 
} 
 
#upArrowBlueCard:hover, #downArrowBlueCard:hover { 
 
    cursor: pointer; 
 
} 
 
#upArrowBlueCard, #downArrowBlueCard { 
 
    font-size: 25px; 
 
} 
 
#numberBlueCardButton, #numberPurchaseStockButton { 
 
    width: 150px; 
 
    height: 30px; 
 
    border: 1.5px solid darkgray; 
 
} 
 
#numberBlueCardButton:hover, #numberPurchaseStockButton:hover { 
 
    cursor: pointer; 
 
}body { 
 
    background-color: cornflowerblue; 
 
} 
 
#entireTable { 
 
    position: static; 
 
    display: table; 
 
} 
 
.title { 
 
    display: inline-block; 
 
    white-space: pre-wrap; 
 
    color: blanchedalmond; 
 
} 
 
table { 
 
    border-collapse: collapse; 
 
    background-color: white; 
 
    display: inline-block; 
 
} 
 
#yourStockTable { 
 
    height: 280px; 
 
} 
 
#yourMoneyTable { 
 
    height: 280px; 
 
    width: 280px; 
 
} 
 
#moneyTab { 
 
    white-space: pre-wrap; 
 
} 
 
th, td { 
 
    border: 1.5px solid darkgray; 
 
    text-align: center; 
 
    padding: 6px; 
 
} 
 
#purchaseStockButton, #sellStockButton, #flipABlueCard, #flipANewsCard { 
 
    width: 175px; 
 
    height: 30px; 
 
    border: 1.5px solid darkgray; 
 
} 
 
#purchaseStockButton { 
 
    background-color: darkolivegreen; 
 
} 
 
#sellStockButton { 
 
    background-color: brown; 
 
} 
 
#flipABlueCard { 
 
    background-color: skyblue; 
 
} 
 
#flipANewsCard { 
 
    background-color: coral; 
 
} 
 
#purchaseStockButton:hover, #sellStockButton:hover, #flipABlueCard:hover, #flipANewsCard:hover { 
 
    cursor: pointer; 
 
} 
 
#flipBlueCardBox, #purchaseStockBox { 
 
    opacity: 0; 
 
} 
 
#numberBlueCard { 
 
    width: 40px; 
 
} 
 
#numberPurchaseStock { 
 
    width: 65px; 
 
} 
 
#upArrowBlueCard:hover, #downArrowBlueCard:hover { 
 
    cursor: pointer; 
 
} 
 
#upArrowBlueCard, #downArrowBlueCard { 
 
    font-size: 25px; 
 
} 
 
#numberBlueCardButton, #numberPurchaseStockButton { 
 
    width: 150px; 
 
    height: 30px; 
 
    border: 1.5px solid darkgray; 
 
} 
 
#numberBlueCardButton:hover, #numberPurchaseStockButton:hover { 
 
    cursor: pointer; 
 
}
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <meta charset="utf-8"> 
 
     <meta name="viewport" content="width=device-width"> 
 
     <link rel="icon" href="icon.ico"> 
 
     <title>Stock Market Board</title> 
 
     <script src="https://code.jquery.com/jquery-3.1.1.js"></script> 
 
    </head> 
 
    <body> 
 
      <center> 
 
       <div id = "entireTable"> 
 
        <table> 
 
         <tr> 
 
          <th>Stock</th> 
 
          <th>Price</th> 
 
         </tr> 
 
         <tr> 
 
          <td>Webnet</td> 
 
          <td id = "webnetPrice">11</td> 
 
         </tr> 
 
         <tr> 
 
          <td>Clone Corp</td> 
 
          <td id = "cloneCorpPrice">12</td> 
 
         </tr> 
 
         <tr> 
 
          <td>City Bank</td> 
 
          <td id = "cityBankPrice">15</td> 
 
         </tr> 
 
         <tr> 
 
          <td>Herbmart</td> 
 
          <td id = "herbmartPrice">14</td> 
 
         </tr> 
 
         <tr> 
 
          <td>Digital Systems</td> 
 
          <td id = "digitalSystemsPrice">17</td> 
 
         </tr> 
 
         <tr> 
 
          <td>National Airlines</td> 
 
          <td id = "nationalAirlinesPrice">10</td> 
 
         </tr> 
 
         <tr> 
 
          <td>State Power</td> 
 
          <td id = "statePowerPrice">16</td> 
 
         </tr> 
 
         <tr> 
 
          <td>Parkland</td> 
 
          <td id = "parklandPrice">13</td> 
 
         </tr> 
 
        </table> 
 
        <table id = "yourStockTable"> 
 
         <tr id = "yourStockTableHeader"> 
 
          <th>Shares</th> 
 
          <th>Stock</th> 
 
          <th>Cost</th> 
 
          <th>Stock Price</th> 
 
         </tr> 
 
        </table> 
 
        <table id = "yourMoneyTable"> 
 
         <tr> 
 
          <th id = "moneyTab">       Money        </th> 
 
         </tr> 
 
         <tr> 
 
          <td id = "money">10000</td> 
 
         </tr> 
 
        </table> 
 
        <br> 
 
        <button id = "purchaseStockButton">Purchase Stock</button> 
 
        <button id = "sellStockButton">Sell Stock</button> 
 
        <button id = "flipABlueCard" >Flip A Blue Card</button> 
 
        <button id = "flipANewsCard">Flip A News Card</button> 
 
      </div> 
 
       <div id = "flipBlueCardBox"> 
 
        <h3 class = "title">Blue Card Number</h3> 
 
        <br> 
 
        <input id = "numberBlueCard" value = "1" type = "number" min = "1" max = "22"><br><br> 
 
        <button id = "numberBlueCardButton">Set</button> 
 
       </div> 
 
       <div id = "purchaseStockBox"> 
 
        <h3 class = "title">Purchase Stock</h3><br> 
 
        <table> 
 
         <tr> 
 
          <th>Stock</th> 
 
          <th>Amount</th> 
 
          <th>Cost</th> 
 
          <th>Money After Transaction</th> 
 
         </tr> 
 
         <tr> 
 
          <td> 
 
           <select id = "purchaseStockSelect"> 
 
            <option value = "Webnet">WEB</option> 
 
            <option value = "Clone Corp">CC</option> 
 
            <option value = "City Bank">CTY</option> 
 
            <option value = "Herbmart">H</option> 
 
            <option value = "Digital Systems">DS</option> 
 
            <option value = "National Airlines">NA</option> 
 
            <option value = "State Power">SP</option> 
 
            <option value = "Parkland">P</option> 
 
           </select> 
 
          </td> 
 
          <td><input id = "numberPurchaseStock" type = "number" min = "100" value = "100" step = "100"></td> 
 
          <td id = "purchaseStockPrice">0</td> 
 
          <td id = "purchaseStockMoneyAfterPrice"></td> 
 
         </tr> 
 
        </table><br> 
 
        <button id = "numberPurchaseStockButton">Set</button> 
 
       </div> 
 
     </center> 
 
    </body> 
 
</html>

P.S。 P.P.Sプログラムを操作して（rowsを作成するには）、「購入在庫」buttonを押します。あなたはnestedevent秒をしましたので、あなたがそうするたびに新しいeventが添付されますクリックすると、それは同じelementに複数のevent添付ファイルにつながり、event秒内event Sを装着している起こる

出典

2017-10-31 CyanCoding

+4

あなたはネストされたイベントを持っているので、イベントの中にイベントを添付しているので、イベントをクリックするたびに同じエレメントへの複数のイベント添付が発生します。 –

+0

それ？ – CyanCoding

答えて

0

。 

$("#numberPurchaseStockButton").off('click').on('click', function() {

代わりのこの

：

はnestedevents &がevent Sを引き出し、またはon()を使用して、新しいものを取り付ける前にeventを切り離すことoff()を使用して、次のように避けるようにしてください

$("#numberPurchaseStockButton").click(function() {

これが役に立ちます。

出典

2017-10-31 20:07:17

関連する問題

 関連する問題