将两个选定值一起添加,然后显示结果JavaScript

时间:2014-12-06 03:46:57

标签: javascript

尝试从ID标记 totalDiv-totalDiv1 获取值,每个值显示所选值的结果,然后将它们一起添加以显示ID标记中实时组合的值 totalall 但我一直 NaN

enter image description here

<h2>£10 Each</h2>
<select name="iteam1" onChange="calc1()">
    <option value="10">1</option>
    <option value="20">2</option>
    <option value="30">3</option>
    <option value="40">4</option>
    <option value="50">5</option>
</select>

<div id="totalDiv1">&pound;10</div>

<h2>£10 Each</h2>
<select name="iteam" onChange="calc()">
    <option value="10">1</option>
    <option value="20">2</option>
    <option value="30">3</option>
    <option value="40">4</option>
    <option value="50">5</option>
</select>

<div id="totalDiv">&pound;10</div>
<br>
<h2>Total</h2>
<div id="totalall">&pound;0</div>

<script>
function calc() {

var fruitOrVeg = document.getElementsByName("iteam")[0].value;
var total = fruitOrVeg;
   document.getElementById("totalDiv").innerHTML= "£" +(total);
}
</script>

<script>
function calc1() {

var fruitOrVeg = document.getElementsByName("iteam1")[0].value;
var total = fruitOrVeg;
   document.getElementById("totalDiv1").innerHTML= "£" +(total);
}
</script>

<script>
window.onload = function total() {

    var y = document.getElementById("totalDiv").value;
    var z = document.getElementById("totalDiv1").value;
    var x = +y + +z;
    document.getElementById("totalall").innerHTML = "£" + x;
}
</script>

2 个答案:

答案 0 :(得分:2)

要小心点。 1.不要混淆价值和符号 2.你在div中的Calc函数中添加符号,后来尝试将它们组合起来,所以它显然不是数字;

http://jsfiddle.net/ga16gt74/

<h2>£10 Each</h2>
<select name="iteam1" onChange="calc1()">
    <option value="10">1</option>
    <option value="20">2</option>
    <option value="30">3</option>
    <option value="40">4</option>
    <option value="50">5</option>
</select>

<div id="totalDiv1">&pound;
  <span id="totalDiv1Value">0</span>
</div>

<h2>£10 Each</h2>
<select name="iteam" onChange="calc()">
    <option value="10">1</option>
    <option value="20">2</option>
    <option value="30">3</option>
    <option value="40">4</option>
    <option value="50">5</option>
</select>

<div id="totalDiv">&pound;
  <span id="totalDivValue">0</span>
</div>
<br>
<h2>Total</h2>
<div id="totalall">&pound;0</div>


<script>
function calc() {
    var fruitOrVeg = document.getElementsByName("iteam")[0].value;
    var value = fruitOrVeg;
    document.getElementById("totalDivValue").innerHTML= value;
    total();
}



function calc1() {
    var fruitOrVeg = document.getElementsByName("iteam1")[0].value;
    var value = fruitOrVeg;
    document.getElementById("totalDiv1Value").innerHTML= value;
    total();
}

function total() {

    var y = parseInt(document.getElementById("totalDivValue").innerHTML);
    var z = parseInt(document.getElementById("totalDiv1Value").innerHTML);
    var x = y+z;
    document.getElementById("totalall").innerHTML = "£" + x;
}
</script>

答案 1 :(得分:0)

这样做:

var fruitOrEgg = parseInt(documentgetElementsByName("iteam")[0].value);

在您的计算器功能中。