计算变量百分比时，Javascript计算返回“开”_Javascript_Html

计算变量百分比时，Javascript计算返回“开”

javascript html

计算变量百分比时，Javascript计算返回“开”,javascript,html,Javascript,Html,我用不同的模块构造了一个计算表单，并使它除了1个元素之外都能工作整体计算建立为value+value=total，值均为正则数但是，我添加的最后一位是一个“百分比”值，它是表单中第一个值的10%。例如：值1=50，百分比值2=5值1的10%，总数=55 在我的代码中，如下所示： var NonTrans_prices = new Array(); NonTrans_prices["NoneNon"] = 0; NonTrans_prices["LemonNon"] = 5994; No

我用不同的模块构造了一个计算表单，并使它除了1个元素之外都能工作

整体计算建立为value+value=total，值均为正则数

但是，我添加的最后一位是一个“百分比”值，它是表单中第一个值的10%。例如：值1=50，百分比值2=5值1的10%，总数=55

在我的代码中，如下所示：

var NonTrans_prices = new Array();
NonTrans_prices["NoneNon"] = 0;
NonTrans_prices["LemonNon"] = 5994;
NonTrans_prices["CustardNon"] = 7076;

function NonTrans() {
    var NonTransPrice = 0;
    var theForm = document.forms["GRANADANEO"];
    var selectedFilling = theForm.elements["NonTrans"];
    NonTransPrice = NonTrans_prices[selectedFilling.value];
    return NonTransPrice;
}
var price = NonTrans_prices;
var percentage = 10;
var costs = (price * percentage) / 100;
var optionprice = price + percentage;

function optionprice1() {
    var inscriptionPrice = 0;
    var theForm = document.forms["GRANADANEO"];
    var optionprice = theForm.elements["optionprice"];
    if (optionprice.checked == true) {
        inscriptionPrice = optionprice.value;
    }
    return inscriptionPrice;
}

function calculateTotal() {
    var cakePrice = NonTrans() + optionprice1();
    var divobj = document.getElementById('totalPrice');
    divobj.style.display = 'block';
    divobj.innerHTML = "Total Price: " + cakePrice + " \u20ac";
}

*非运输价格连接到下拉框，选项价格1连接到复选框

只要我勾选包含10%价值的复选框，上的字母就会添加到总价中。怎么了

**抱歉，忘了发布完整的代码，以便你们可以测试：由于某些原因，它没有在JSFIDLE中显示总价值，在我正在测试的实时网站上，它会显示总价值，所以这不是我实时面临的问题。实时链接：

这是包含受.js代码影响的部分的HTML代码：

<body onload='hideTotal()'>
<div id="wrap">
<form action="" id="GRANADANEO" onsubmit="return false;">
<div>
<div class="cont_order">
<fieldset>
<table><tr><td>
<label >NonTrans</label>
<select id="NonTrans" name='NonTrans' onchange="calculateTotal()">
<option value="NoneNon">Select Dimensions</option>
<option value="LemonNon">3,00 6,40 0,85</option>
<option value="CustardNon">3,00 7,50 0,85</option>
</select>
</td></tr></table>
<hr>
<br/>    
<label>Granada Neo Opties Algemeen</label>
<p>
<input type="checkbox" id="optionprice" name='optionprice' onclick="calculateTotal()" />
<label for='optionprice' class="inlinelabel">optionprice</label>
</p>
<p>
<input type="checkbox" id="SchuifdeurVoorzijde" name='SchuifdeurVoorzijde' onclick="calculateTotal()" />
<label for='SchuifdeurVoorzijde' class="inlinelabel">Schuifdeur in voorzijde</label>
</p>
<div id="totalPrice"></div>
</fieldset>
</div>
</div>  
</form>

选中复选框时，其值为“开”。确保复选框包含一个值属性，该属性包含它们所表示的有意义的数据。例如：

     <input type="checkbox" id="chkSomeId" name="chkSomeID" 
            value="someValueToBeWhenChecked">

很可能正在访问复选框或单选按钮的值，该复选框或单选按钮没有为其设置显式值，但已选中

另外，请记住，从HTML中提取的所有值都以字符串的形式进入JavaScript，因此，如果需要对这些值进行计算，则需要使用parseInt和parseFloat

更新：现在您已经发布了HTML，我看到了以下内容：

 <input type="checkbox" id="optionprice" name='optionprice' onclick="calculateTotal()" />

我认为您应该将4条var行包括在函数中。我认为第一行：var价格=非交易价格；不正确，因为它将可变价格设置为非交易价格的实际数组，而不是查找特定价格，即：

 var price = NonTrans_prices[document.getElementById("nonTransList").value];

然后，您的问题是，如果选中optionPrice复选框，您将尝试访问该复选框的值，正如我所说的，该值并不明确存在，因此您可以继续，因为复选框已选中。您应该做的是将价格设置为刚刚在上面一行中完成的10%计算的结果。最后一个函数如下所示：

 function optionprice1()
 {
     var chkOptionPrice = document.getElementById("optionprice");
     var lstNonTransValue = document.getElementById(NonTrans).value;

     var inscriptionPrice = 0;

     if(optionprice.checked === true){

      // Look up the price in the array that matches the dropdown list's value
      var price = NonTrans_prices[lstNonTransValue];

      // Do the math to calculate 10% of the original price
      var percentage = 10;
      inscriptionPrice = (price * percentage) / 100;;
     }

     // finally we return the inscriptionPrice
     return inscriptionPrice;
 }

你很接近，但我认为，让你绊倒的是，你创建了一个与复选框同名的变量，在进行计算后，你本应该尝试获取变量的值，但你尝试获取复选框的值，而这不是答案所在

我希望我已经正确理解了您想要的内容，但即使我的算法已关闭，我希望您能看到您不想使用复选框的值来获取答案，因为它不存储任何值。

最后，在Scott Marcus的帮助下，这是解决方案：

function optionprice1()
{
 var chkOptionPrice = document.getElementById("optionprice");
 var theForm = document.forms["GRANADANEO"];
 var selectedFilling = theForm.elements["NonTrans"];
 var lstNonTransValue = NonTrans_prices[selectedFilling.value];

 var inscriptionPrice = 0;

 if(optionprice.checked === true){

  // Look up the price in the array that matches the dropdown list's value
  var price = NonTrans_prices[selectedFilling.value];

  // Do the math to calculate 10% of the original price
  var percentage = 10;
  inscriptionPrice = (price * percentage) / 100;
 }

 // finally we return the inscriptionPrice
 return inscriptionPrice;
 }

有HTML可供使用吗？optionprice似乎是一个复选框，选中时其值将打开。@RokoC.Buljan抱歉mate忘记了这一点，只是在post@JozefLeg对我来说，这听起来非常合乎逻辑，但目的是显示计算值，而不是框的开/关值。你知道我怎样才能做到吗？@YassineLamlih:不，你不知道。你可能已经添加了一个链接到它，但它必须在问题中，不仅仅是链接。那不是我，我已经添加了一些HTML代码，在那里你可以看到我有另一个复选框，它做它应该做的事情，这传达了它的价值。出于某种原因，“optionprice”复选框不适用相同的逻辑。@YassineLamlih您不能访问JavaScript中的SchuifdeurVoorzijde复选框值。您仅使用它来调用函数。这就是为什么这个能起作用。但是，您正在代码中访问optionprice复选框的值，并且没有为其设置值，因此您可以在选中后继续操作。更正，我没有阅读您编辑的帖子，请给我一些来处理您所说的内容，谢谢@YassineLamlih您无法通过该代码获得SchuifdeurVoorzijde复选框的值。你通过查看它的checked属性来确定它是否被选中。当OP显示我的解释和答案是正确的时，有两张反对票，这太疯狂了。你会希望我的答案是正确的，因为你发布的是我发布给你的答案。我的错是，我认为我可以将这两个答案都指定为正确答案，对stackoverflow来说仍然是新的

 function optionprice1()
 {
     var chkOptionPrice = document.getElementById("optionprice");
     var lstNonTransValue = document.getElementById(NonTrans).value;

     var inscriptionPrice = 0;

     if(optionprice.checked === true){

      // Look up the price in the array that matches the dropdown list's value
      var price = NonTrans_prices[lstNonTransValue];

      // Do the math to calculate 10% of the original price
      var percentage = 10;
      inscriptionPrice = (price * percentage) / 100;;
     }

     // finally we return the inscriptionPrice
     return inscriptionPrice;
 }

function optionprice1()
{
 var chkOptionPrice = document.getElementById("optionprice");
 var theForm = document.forms["GRANADANEO"];
 var selectedFilling = theForm.elements["NonTrans"];
 var lstNonTransValue = NonTrans_prices[selectedFilling.value];

 var inscriptionPrice = 0;

 if(optionprice.checked === true){

  // Look up the price in the array that matches the dropdown list's value
  var price = NonTrans_prices[selectedFilling.value];

  // Do the math to calculate 10% of the original price
  var percentage = 10;
  inscriptionPrice = (price * percentage) / 100;
 }

 // finally we return the inscriptionPrice
 return inscriptionPrice;
 }