2014-12-06 46 views
1

試圖從ID標記中獲取值totalDiv-totalDiv1每個都顯示選定值的結果,然後將它們相加以顯示實時組合的值ID tag totalall但我總是收到NaN將兩個選定的值一起添加,然後顯示結果JavaScript

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

點照顧。 1.不要混合數值和符號 2.您在Calc函數中添加符號div,然後嘗試將它們組合起來,因此顯然不是數字;

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> 
+0

謝謝,這對我有效 – magi4000 2014-12-06 11:02:27

0

這樣做:

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

在您的計算器功能。

相關問題