在多個選定的複選框上運行javascript

Question

你好，我目前正在編寫一個Web應用程序，根據用戶檢查的內容計算出一個數字。您可以看到它here。

如果您轉到鏈接，您可以看到一個人會首先選中一個複選框並從下拉列表中輸入一個值，然後輸入2值以獲得輸出。

我需要幫助的是能夠一次計算多個複選框的值。

現在我只能計算一個checkbox的值，即使選擇了多個也是如此。所以基本上我需要幫助，試圖找出如何計算一次超過一個checkbox。

我在我的javascript文件裏面使用了if聲明，但那不會給我想要的結果。

Answer 1

只是刪除else if語句，改變了如果只。但我不得不說，這是一個不可擴展的解決方案，對於大型應用程序而言，這可能會變成一場噩夢。

我建議您嘗試使用$（「input：checked」）。each（function（）{}）;如果你不想存儲它，只顯示客戶端上的值，以避免進一步的問題和錯誤的代碼。根據您的想法，您每次需要複製和粘貼這些IF時，您就需要實施新的表單標籤。

$(document).ready(function(){ 
    function check(){ 
     if($('#checkbox1').is(':checked')){ 
      var pokemonCount = parseInt($("#pokecount1").val()); 
      var candyCount = parseInt($("#candycount1").val()); 
      var reqCandy = parseInt($("#dropdown1 :selected").val()); 
      var evolveAmount = 0; 

      evolveAmount = Math.floor(((candyCount + pokemonCount) - 1)/(reqCandy)); 
      $("#p1").html(evolveAmount); 
      } 
     if($('#checkbox2').is(':checked')){ 
      var pokemonCount2 = parseInt($("#pokecount2").val()); 
      var candyCount2 = parseInt($("#candycount2").val()); 
      var reqCandy2 = parseInt($("#dropdown2 :selected").val()); 
      var evolveAmount2 = 0; 

      evolveAmount2 = Math.floor(((candyCount2 + pokemonCount2) - 1)/(reqCandy2)); 
      $("#p2").html(evolveAmount2); 
      } 
     if ($('#checkbox3').is(':checked')){ 
      var pokemonCount3 = parseInt($("#pokecount3").val()); 
      var candyCount3 = parseInt($("#candycount3").val()); 
      var reqCandy3 = parseInt($("#dropdown3 :selected").val()); 
      var evolveAmount3 = 0; 

      evolveAmount3 = Math.floor(((candyCount3 + pokemonCount3) - 1)/(reqCandy3)); 
      $("#p3").html(evolveAmount3); 
      } 
     } 
    $("#compute").click(function(){ 
     check() 
    }); 

}); 

Answer 2

如果到如果只

$(document).ready(function(){ 
function check(){ 
    if($('#checkbox1').is(':checked')){ 
     var pokemonCount = parseInt($("#pokecount1").val()); 
     var candyCount = parseInt($("#candycount1").val()); 
     var reqCandy = parseInt($("#dropdown1 :selected").val()); 
     var evolveAmount = 0; 

     evolveAmount = Math.floor(((candyCount + pokemonCount) - 1)/(reqCandy)); 
     $("#p1").html(evolveAmount); 
     } 
    if($('#checkbox2').is(':checked')){ 
     var pokemonCount2 = parseInt($("#pokecount2").val()); 
     var candyCount2 = parseInt($("#candycount2").val()); 
     var reqCandy2 = parseInt($("#dropdown2 :selected").val()); 
     var evolveAmount2 = 0; 

     evolveAmount2 = Math.floor(((candyCount2 + pokemonCount2) - 1)/(reqCandy2)); 
     $("#p2").html(evolveAmount2); 
     } 
    if ($('#checkbox3').is(':checked')){ 
     var pokemonCount3 = parseInt($("#pokecount3").val()); 
     var candyCount3 = parseInt($("#candycount3").val()); 
     var reqCandy3 = parseInt($("#dropdown3 :selected").val()); 
     var evolveAmount3 = 0; 

     evolveAmount3 = Math.floor(((candyCount3 + pokemonCount3) - 1)/(reqCandy3)); 
     $("#p3").html(evolveAmount3); 
     } 
    } 
$("#compute").click(function(){ 
    check() 
}); 

}); 

Answer 3

用過elseif你，所以如果第一個複選框被選中，然後運行該代碼並停止只是刪除否則。

if(1.isChecked){ 

} 

if(2.isChecked){ 

} 

Answer 4

您正在使用else if語句在你的代碼，這意味着只有3中的一個代碼，如果語句可以執行：你需要一系列的if塊。更多信息here。

你需要用簡單的if語句來取代它們，就像這樣：

$(document).ready(function(){ 
    function check(){ 
     if($('#checkbox1').is(':checked')){ 
      var pokemonCount = parseInt($("#pokecount1").val()); 
      var candyCount = parseInt($("#candycount1").val()); 
      var reqCandy = parseInt($("#dropdown1 :selected").val()); 
      var evolveAmount = 0; 

      evolveAmount = Math.floor(((candyCount + pokemonCount) - 1)/(reqCandy)); 
      $("#p1").html(evolveAmount); 
      } 
     if($('#checkbox2').is(':checked')){ 
      var pokemonCount2 = parseInt($("#pokecount2").val()); 
      var candyCount2 = parseInt($("#candycount2").val()); 
      var reqCandy2 = parseInt($("#dropdown2 :selected").val()); 
      var evolveAmount2 = 0; 

      evolveAmount2 = Math.floor(((candyCount2 + pokemonCount2) - 1)/(reqCandy2)); 
      $("#p2").html(evolveAmount2); 
      } 
     if ($('#checkbox3').is(':checked')){ 
      var pokemonCount3 = parseInt($("#pokecount3").val()); 
      var candyCount3 = parseInt($("#candycount3").val()); 
      var reqCandy3 = parseInt($("#dropdown3 :selected").val()); 
      var evolveAmount3 = 0; 

      evolveAmount3 = Math.floor(((candyCount3 + pokemonCount3) - 1)/(reqCandy3)); 
      $("#p3").html(evolveAmount3); 
      } 
     } 
    $("#compute").click(function(){ 
     check() 
    }); 

});