如何修复＆＃39;复选框＆＃39;通知

Question

嗨，我被困住了，我需要帮助。

如下面提供的编码所示，如​​果我删除了所有的“疫苗接种”复选框，它就能正常工作。属性。但是我需要对疫苗接种疫苗＆＃39;在这种情况下的财产。

请尽量保留提供的大部分代码

这是学校的家庭作业。 谢谢你提前！

＆＃13;

＆＃13;

./public/css/

＆＃13;

    function calculateCost() {

      var radioButton;
      var checkbox;
      var pet;
      var colour;
      var vaccinate;
      var cost = 0;

      var selectedPet = ["Cat", "Dog", "Rabbit"];
      var selectedColour = ["Black", "Gold", "White"];
      var selectedVaccinate = ["Vaccinate"];
      
      var selectedPetCost;
      var selectedColourCost;
      var selectedVaccinateCost;

      for (var i = 1; i <= 3; i++) {
        radioButton = document.getElementById(selectedPet[i - 1]);
        if (radioButton.checked == true) {
          pet = selectedPet[i - 1];
          selectedPetCost = parseInt(radioButton.value);
          //alert(parseInt(radioButton.value));
        }
      }
      
      if (!pet) {
        alert('No pet selected!');
      }

      for (var i = 1; i <= 3; i++) {
        radioButton = document.getElementById(selectedColour[i - 1]);
        if (radioButton.checked == true) {
          colour = selectedColour[i - 1];
          selectedColourCost = parseInt(radioButton.value);
          //alert(parseInt(radioButton.value));
        }
      }
      
      if (!colour) {
        alert('No colour selected!');
      }
      
      for (var i = 1; i <= 1; i++) {
        checkbox = document.getElementById(selectedVaccinate[i - 1]);
        if (checkbox.checked == true) {
          pet = selectedVaccinate[i - 1];
          selectedVaccinateCost = parseInt(checkbox.value);
        }
      }
      
      if (pet && colour && vaccinate) {
        cost = selectedPetCost * selectedColourCost * selectedVaccinateCost;
        alert("You have selected a " + pet + " and the colour selected was " + colour + ", the total cost is $" + cost);
      }
      
      if (pet && colour) {
        cost = selectedPetCost * selectedColourCost;
        alert("You have selected a " + pet + " and the colour selected was " + colour + ", the total cost is $" + cost);
      }
      
    }

＆＃13;

＆＃13;

＆＃13;

Answer 1

你在函数中犯了几个错误，我已经解决了这些问题。请尝试以下代码

function calculateCost() {

  var radioButton;
  var checkbox;
  var pet;
  var colour;
  var vaccinate;
  var cost = 0;

  var selectedPet = ["Cat", "Dog", "Rabbit"];
  var selectedColour = ["Black", "Gold", "White"];
  var selectedVaccinate = ["vaccinate"];

  var selectedPetCost;
  var selectedColourCost;
  var selectedVaccinateCost;

  for (var i = 1; i <= 3; i++) {
    radioButton = document.getElementById(selectedPet[i - 1]);
    if (radioButton.checked == true) {
      pet = selectedPet[i - 1];
      selectedPetCost = parseInt(radioButton.value);
      //alert(parseInt(radioButton.value));
    }
  }
  if (!pet) {
    alert('No pet selected!');
    }

  for (var i = 1; i <= 3; i++) {
    radioButton = document.getElementById(selectedColour[i - 1]);
    if (radioButton.checked == true) {
      colour = selectedColour[i - 1];
      selectedColourCost = parseInt(radioButton.value);
      //alert(parseInt(radioButton.value));
    }
  }
  if (!colour) {
    alert('No colour selected!');
  }

     for (var i = 1; i <= 1; i++) {
    checkbox = document.getElementById(selectedVaccinate[i - 1]);
    if (checkbox.checked == true) {
      vaccinate = selectedVaccinate[i - 1];
      selectedVaccinateCost = parseInt(checkbox.value);
    }
  }
  if (pet && colour && vaccinate) {
    cost = selectedPetCost * selectedColourCost * selectedVaccinateCost;
    alert("You have selected a " + pet + " and the colour selected was " + colour + ", the total cost is $" + cost);
  }
  else if (pet && colour) {
    cost = selectedPetCost * selectedColourCost;
    alert("You have selected a " + pet + " and the colour selected was " + colour + ", the total cost is $" + cost);
  }
}

Working example

据我了解，当您只选择宠物和颜色时，您应该花费宠物和颜色，而当选择接种疫苗时，您应该通过接种疫苗获得宠物和颜色的费用。我希望这个答案可以解决你的问题。

Answer 2

这是您的javascript代码。

＆＃13;

＆＃13;

        function calculateCost() {

      var radioButton;
      var checkbox;
      var pet;
      var colour;
      var vaccinate;
      var cost = 0;

      var selectedPet = ["Cat", "Dog", "Rabbit"];
      var selectedColour = ["Black", "Gold", "White"];
      var selectedVaccinate = ["vaccinate"];
      
      var selectedPetCost;
      var selectedColourCost;
      var selectedVaccinateCost;

      for (var i = 1; i <= 3; i++) {
        radioButton = document.getElementById(selectedPet[i - 1]);
        if (radioButton.checked == true) {
          pet = selectedPet[i - 1];
          selectedPetCost = parseInt(radioButton.value);
          // alert(parseInt(radioButton.value));
        }
      }
      

      for (var i = 1; i <= 3; i++) {
        radioButton = document.getElementById(selectedColour[i - 1]);
        if (radioButton.checked == true) {
          colour = selectedColour[i - 1];
          selectedColourCost = parseInt(radioButton.value);
          //alert(parseInt(radioButton.value));
        }
      }
      

      
      for (var i = 1; i <= 1; i++) {
        checkbox = document.getElementById(selectedVaccinate[i - 1]);
        if (checkbox.checked == true) {
          vaccinate = selectedVaccinate[i - 1];
          selectedVaccinateCost = parseInt(checkbox.value);
          //alert(selectedVaccinateCost);
        }
      }
      
      if (pet && colour && vaccinate) {
        cost = selectedPetCost * selectedColourCost * selectedVaccinateCost;
        alert("You have selected a " + pet + " and the colour selected was " + colour + ", the total cost is $" + cost);
      }else if (pet && colour) {
        cost = selectedPetCost * selectedColourCost;
        alert("You have selected a " + pet + " and the colour selected was " + colour + ", the total cost is $" + cost);
      }
      
    }

＆＃13;

  <form>
  <p>Choose a type of pet:
    <br>
    <input type="radio" id="Cat" name="pet" value="200"><label for="cat">Cat</label>
    <br>
    <input type="radio" id="Dog" name="pet" value="200"><label for="dog">Dog</label>
    <br>
    <input type="radio" id="Rabbit" name="pet" value="20"><label for="rabbit">Rabbit</label>
    <br>
  </p>
  
  <p>Choose the colour of pet:
    <br>
    <input type="radio" id="Black" name="colour" value="80"><label for="black">Black</label>
    <br>
    <input type="radio" id="Gold" name="colour" value="100"><label for="gold">Gold</label>
    <br>
    <input type="radio" id="White" name="colour" value="90"><label for="white">White</label>
    <br>
  </p>
  
  <p><label for="vaccinate">With vaccinations
<input type="checkbox" id="vaccinate" name="vaccinate" value="5"></label><br></p>

  <p><input type="button" value="Submit" onClick="calculateCost();">
</form>

＆＃13;

＆＃13;

＆＃13;

您已经命名为＆＃34;接种疫苗＆＃34;变量为＆＃34; pet＆＃34;在vacinate部分。所以，这就是为什么它没有计算实际成本的问题。所以，我改名为宠物＆＃34;变量为＆＃34;接种疫苗＆＃34;它工作正常。

Answer 3

好的，我为你所了解的内容做了一些jquery

＆＃13;

＆＃13;

$('.calculate').click(function(){
animal=$('input[name=animal]:checked').val();
color=$('input[name=color]:checked').val();
if(animal == null || color ==null){
color='nothing'
animal='Nothing'
}
$('.inside').text('You choose '+animal+' Also color '+color);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span>Choose animal you like</span><br>
<input type='radio' name='animal' value='dog'>dog<br>
<input type='radio' name='animal' value='cat'>cat<br>
<input type='radio' name='animal' value='donkey'>dnkey<br>
<span>Choose Color you like</span><br>
<input type='radio' name='color' value='Green'>Green<br>
<input type='radio' name='color' value='Blue'>greeb<br>
<input type='radio' name='color' value='red'>green<br>
<button class='calculate'>
Calculate
</button><br>
<div class='inside'>
Strange huh?
</div>

＆＃13;

＆＃13;

＆＃13;