2014-09-30 174 views
0

我正在爲遊戲創建一個計算器,並且我有一個下拉菜單,它在switch語句中選擇一個值;雖然我不確定如何計算總數。任何人都可以看到他們可以嗎?使用(JavaScript和HTML)計算總數

http://jsfiddle.net/newto98/8xLo9m9u/

這是我的HTML:

<!-- Witch /--> 
<div style="display: inline;"> 
<form style="display: inline;"> 
    <!-- Title of Form /--> <font>Level</font> 
    <!-- Gets Input /--> 
    <select id="witchlevel_input"> 
     <option>0</option> 
     <option>1</option> 
     <option>2</option> 
    </select> 
    <!-- Calls 'calcwitch' /--> 
    <input type="button" value="Calculate" onclick="return calcwitch(document.getElementById('witchlevel_input').value)"> 
    <!-- Outputs result /--> <span id="witchcost_result"> = 0 Dark Elixer</span> 

</form </div> 
<br></br> 
<!-- Lava Hound /--> 
<div style="display: inline;"> 
    <form style="display: inline;"> 
     <!-- Title of Form /--> <font>Level</font> 
     <!-- Gets Input /--> 
     <select id="lavalevel_input"> 
      <option>0</option> 
      <option>1</option> 
      <option>2</option> 
      <option>3</option> 
     </select> 
     <!-- Calls 'calclava' /--> 
     <input type="button" value="Calculate" onclick="return calclava(document.getElementById('lavalevel_input').value)"> 
     <!-- Outputs result /--> <span id="lavacost_result"> = 0 Dark Elixer</span> 

    </form </div> 
     <br></br> 
<!-- Total /--> 
<div style="display: inline;"> 
<form onsubmit="return calctotal(0);" style="display: inline;"> 
<!-- Title of Form /--> 
<font>Total Cost</font> 
<!-- Calls 'calcWalls' /--> 
<input type="button" value="Calculate" onclick="calctotal();"> 
<!-- Outputs result /--> 
<span id="total_result"> = 0 Elixer</span> 
</form> 

這是我的javascript:

<script> 
function calcwitch(witchlevel) { 
var witchString; 
switch (witchlevel) { 
    case '0': 
     witchString = "75000"; 
     break; 
    case '1': 
     witchString = "75000"; 
     break; 
    case '2': 
     witchString = "0"; 
     break; 
} 
document.getElementById("witchcost_result").innerHTML = "= " + Math.round(parseInt(witchString) * 100)/100 + " Dark Elixer"; 

} 

function calclava(lavalevel) { 
var lavaString; 
switch (lavalevel) { 
    case '0': 
     lavaString = "130000"; 
     break; 
    case '1': 
     lavaString = "130000"; 
     break; 
    case '2': 
     lavaString = "70000"; 
     break; 
    case '3': 
     lavaString = "0"; 
     break; 
} 
document.getElementById("lavacost_result").innerHTML = "= " + Math.round(parseInt(lavaString) * 100)/100 + " Dark Elixer"; 

} 
</script> 
+0

您發佈的代碼與JSFiddle – personne3000 2014-09-30 06:39:05

+1

的內容不匹配也請修復您的小提琴,您打擾至少讓它做正確 – Alexandros 2014-09-30 06:44:51

+0

您的總計算邏輯是什麼? – 2014-09-30 06:47:22

回答

1

快,也許不是最完美的解決方案

http://jsfiddle.net/9sjdujtn/

只需從2個函數返回的數值,並使用返回值calctotal()

談到更好的表現,我會計算一個函數和DOM操作拆分到另外一個。我的小提琴現在無故重寫2個元素的innerHTML ...

0

使用document.getElementById(「」)。value計算前兩個LEVEL時,使用兩個隱藏字段併爲其設置值。然後當點擊總成本時,使用函數添加這兩個值,並使用document.getElementById(「」)。innerHTML將其設置在上一個跨度中。