JS код не работает, не показывает всего - PullRequest
Новая
       0

JS код не работает, не показывает всего

1 голос
/ 26 мая 2019

Я пытаюсь вычислить три значения, используя JS, но общее значение не вычисляется.он получает значения из элементов формы, а затем функция calculateTotal() называется onchange.Но общая сумма не отображается.* Я новичок в stackoverflow, пожалуйста, будьте добры!

Я пытался использовать метод Post в форме, удалил его.Также удалены все стили. 

function getpkgPriceA() {
  //Get a reference to the form id="Mangoform"
  var theForm = document.forms["Mangoform"];
  //Get a reference to the select id="qtyA"
  var QuantityA = theForm.elements["qtyA"];
  if (QuantityA == null || QuantityA === false) {
    var totalpkgPriceA = 0;
    return totalpkgPriceA;
  } else {
    var totalpkgPriceA = 5.99 * QuantityA.value;
    return totalpkgPriceA;
  }
}

function getpkgPriceB() {
  //Get a reference to the form id="Mangoform"
  var theForm = document.forms["Mangoform"];
  //Get a reference to the select id="qtyB"
  var QuantityB = theForm.elements["qtyB"];
  if (QuantityB == null || QuantityB === false) {
    var totalpkgPriceB = 0;
    return totalpkgPriceB;
  } else {
    var totalpkgPriceB = 12.99 * QuantityB.value;
    return totalpkgPriceB;
  }
}

function getpkgPriceC() {
  //Get a reference to the form id="Mangoform"
  var theForm = document.forms["Mangoform"];
  //Get a reference to the select id="qtyC"
  var QuantityC = theForm.elements["qtyC"];
  if (QuantityC == null || QuantityC === false) {
    var totalpkgPriceC = 0;
    return totapkgPriceC;
  } else {
    var totalpkgPriceC = 17.99 * QuantityC.value;
    return totalpkgPriceC;
  }
}

function calculateTotal() {

  var TotalpkgPrice = getpkgPriceA() + getpkgPriceB() + getpkgPriceC() + 2;
  //display the result
  var divobj = document.getElementById('totalprice');
  divobj.style.display = 'block';
  divobj.innerHTML = "Your Total: £"
  TotalpkgPrice.toFixed(2);
}

function hideTotal() {
  var divobj = document.getElementById('totalprice');
  divobj.style.display = 'none';
}
<form action="#" id="Mangoform">
  <div>
    <div>
      <div>
        <span>Small: 1.3kg</span>
        <input type="number" id="qtyA" name="qtyA" placeholder="Quantity" onchange="calculateTotal()" min="1" max="100">
      </div>
      </br>
      <div>
        <span>Large: 3.3kg</span>
        <input type="number" id="qtyB" name="qtyB" placeholder="Quantity" onchange="calculateTotal()" min="1" max="100">
      </div>
      </br>
      <div>
        <span>Small: 5.0kg</span>
        <input type="number" id="qtyC" name="qtyC" placeholder="Quantity" onchange="calculateTotal()" min="1" max="100">
      </div>
    </div>
  </div>
  <span id="totalprice" name='totalprice'>Your Total:</span>
  <div>
    <input name="submit" type="submit" value="submit" onclick="calculateTotal()">
  </div>
</form>

, если значение в qtyA = 1, qtyB = 1 и qtyC = 1 и добавление 2, тогда итоговое значение должно отображаться
как 38,97

(5,99 * 1) + (12,99 * 1) + (17,99 * 1) + 2 = 38,97

, если qtyA = 2, qtyB = 2 и qtyC = 3, добавив 2 (5,99 * 2) + (12.99* 2) + (17,99 * 3) + 2 = 93,93

Пожалуйста, укажите на ошибку.Благодаря.

Ответы [ 2 ]

2 голосов
/ 26 мая 2019

В функции getpkgPriceA есть одна дополнительная закрывающая фигурная скобка.Вам просто нужно удалить его, а также вам нужно добавить знак + при добавлении строк: 

"Your Total: £" + TotalpkgPrice.toFixed(2);

Попробуйте это: 

function getpkgPriceA(){
    //Get a reference to the form id="Mangoform"
    var theForm = document.forms["Mangoform"];
    //Get a reference to the select id="qtyA"
    var QuantityA=theForm.elements["qtyA"];
    if(QuantityA==null || QuantityA===false){
        var totalpkgPriceA = 0;
        return totalpkgPriceA;
    }
        var totalpkgPriceA = 5.99 * QuantityA.value;
        return totalpkgPriceA;
}

function getpkgPriceB(){
    //Get a reference to the form id="Mangoform"
    var theForm = document.forms["Mangoform"];
    //Get a reference to the select id="qtyB"
    var QuantityB=theForm.elements["qtyB"];
    if(QuantityB==null || QuantityB===false){
        var totalpkgPriceB = 0;
        return totalpkgPriceB;
    }
    else{
        var totalpkgPriceB = 12.99 * QuantityB.value;
        return totalpkgPriceB;
    }
}

function getpkgPriceC(){
    //Get a reference to the form id="Mangoform"
    var theForm = document.forms["Mangoform"];
    //Get a reference to the select id="qtyC"

    var QuantityC=theForm.elements["qtyC"];
    if(QuantityC==null || QuantityC===false){
        var totalpkgPriceC = 0;
        return totapkgPriceC;
    }
    else{
        var totalpkgPriceC = 17.99 * QuantityC.value;
        return totalpkgPriceC;
    }
}

function calculateTotal(){
    var TotalpkgPrice =  getpkgPriceA() + getpkgPriceB() + getpkgPriceC() +2; 
    //display the result
    var divobj = document.getElementById('totalprice');
    divobj.style.display='block';
    divobj.innerHTML = "Your Total: £" + TotalpkgPrice.toFixed(2)  ;
   }

function hideTotal(){
  var divobj = document.getElementById('totalprice');
    divobj.style.display='none';
}
<form  action="#" id="Mangoform">
    <div >                      
    <div>
    <div> 
            <span>
                Small: 1.3kg 
            </span>
            <input  type="number" id="qtyA" name="qtyA"  placeholder="Quantity" onchange="calculateTotal()" min="1" max="100" > 
        </div>
        </br>
        <div>
        <span>
            Large: 3.3kg 
        </span>
        <input type="number" id="qtyB" name="qtyB"  placeholder="Quantity" onchange="calculateTotal()" min="1" max="100" > 
        </div>
        </br>
        <div>
            <span>
                Small: 5.0kg 
            </span>
            <input type="number" id="qtyC" name="qtyC"  placeholder="Quantity" onchange="calculateTotal()" min="1" max="100" > 
        </div> 
        </div>
        </div>
        <span id="totalprice" name='totalprice'>
            Your Total:
        </span>
        <div>  
            <input name="submit" type="submit" value="submit" onclick="calculateTotal()" >
        </div>

</form>
1 голос
/ 26 мая 2019 

function getpkgPriceA() {

  //Get a reference to the form id="Mangoform"
  var theForm = document.forms["Mangoform"];
  //Get a reference to the select id="qtyA"


  var QuantityA = theForm.elements["qtyA"];
  if (QuantityA == null || QuantityA === false) {
    var totalpkgPriceA = 0;
    return totalpkgPriceA;
  } else {
    var totalpkgPriceA = 5.99 * QuantityA.value;
    return totalpkgPriceA;
  }
}

function getpkgPriceB() {

  //Get a reference to the form id="Mangoform"
  var theForm = document.forms["Mangoform"];
  //Get a reference to the select id="qtyB"


  var QuantityB = theForm.elements["qtyB"];
  if (QuantityB == null || QuantityB === false) {
    var totalpkgPriceB = 0;
    return totalpkgPriceB;
  } else {
    var totalpkgPriceB = 12.99 * QuantityB.value;
    return totalpkgPriceB;
  }
}

function getpkgPriceC() {

  //Get a reference to the form id="Mangoform"
  var theForm = document.forms["Mangoform"];
  //Get a reference to the select id="qtyC"


  var QuantityC = theForm.elements["qtyC"];
  if (QuantityC == null || QuantityC === false) {
    var totalpkgPriceC = 0;
    return totapkgPriceC;
  } else {
    var totalpkgPriceC = 17.99 * QuantityC.value;
    return totalpkgPriceC;
  }
}

function calculateTotal() {

  var TotalpkgPrice = getpkgPriceA() + getpkgPriceB() + getpkgPriceC() + 2;
  var divobj = document.getElementById('totalprice');
  divobj.style.display = 'block';
  divobj.innerHTML = "Your Total: £" + TotalpkgPrice.toFixed(2);
}

function hideTotal() {

  var divobj = document.getElementById('totalprice');
  divobj.style.display = 'none';
}
<form id="Mangoform">
  <div>
    <div>
      <div>
        <span>
                Small: 1.3kg 
            </span>
        <input type="number" id="qtyA" name="qtyA" placeholder="Quantity" onchange="calculateTotal();" min="1" max="100">
      </div>
      </br>
      <div>
        <span>
            Large: 3.3kg 
        </span>
        <input type="number" id="qtyB" name="qtyB" placeholder="Quantity" onchange="calculateTotal();" min="1" max="100">
      </div>
      </br>
      <div>
        <span>
                Small: 5.0kg 
            </span>
        <input type="number" id="qtyC" name="qtyC" placeholder="Quantity" onchange="calculateTotal();" min="1" max="100">
      </div>
    </div>
  </div>
  <span id="totalprice" name='totalprice'>
            Your Total:
        </span>

  <div>
    <input name="submit" type="button" value="submit" onclick="calculateTotal();">
  </div>

</form>

</body>

</html>

Как было указано ранее с кодом @Saurabh. Другой причиной может быть отсутствие знака + в divobj.innerHTML = "Your Total: £" TotalpkgPrice.toFixed(2) ;, где его необходимо исправить до divobj.innerHTML = "Your Total: £" + TotalpkgPrice.toFixed(2) ;

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...