Javascript Salary Calculator

Question

私はJavascriptを使用して年間給与計算をしようとしています。ここで私はこれまで持っているものです。

<div id="fulldiv"> 
 
\t \t <p> Enter the following information to calculate your annual salary.</p> 
 
\t \t \t \t \t 
 
\t \t <p>Hourly Wage: 
 
\t \t <input type="text" name="wage" id="txt_wage" value ="0.00"/></p> 
 
\t \t \t \t \t 
 
\t \t <p>Hours Per Week: 
 
\t \t <input type="text" name="hours" id="txt_hours" value= "0.0"/> <br/><br/> 
 
\t \t 
 
\t \t <button value="calculate" onclick="calcSalary()">Calculate</button></p> 
 
\t \t 
 
\t \t <p id="results"></p> 
 
\t \t \t \t \t 
 
\t \t <script type="text/javascript"> 
 
\t \t 
 
\t \t function calcSalary() { 
 
\t \t var wage_element = document.getElementById('txt_wage'); 
 
\t \t var wage = parseInt(wage_element.value); 
 
\t \t var hours_element = document.getElementById('txt_hours'); 
 
\t \t var hours = parseInt(hours_element.value); 
 
\t \t var calculate = wage_element * hours_element * 52; 
 
\t \t document.getElementByID('results').innerHTML = calculate; 
 
\t \t } 
 
\t \t </script> 
 
\t \t \t \t 
 
\t \t \t \t \t 
 
\t \t \t \t 
 

 
</div>

私はボタンをクリックすると、何も起こりません。何かご意見は？

Answer 1

そこにいくつかのタイプミス。私はコードを少し書き直し、コードを単純化して、a）あなたの計算が入力の価値にあること、b）入力を基準にしてテキストを提供するラベルを使用していること、pではなく、

function calcSalary() { 
 
var wage = parseFloat(document.getElementById('txt_wage').value); 
 
var hours = parseFloat(document.getElementById('txt_hours').value); 
 
var calculate = wage * hours * 52; 
 
    
 
document.getElementById('results').innerHTML = calculate; 
 
}

<div id="fulldiv"> 
 
<p> Enter the following information to calculate your annual salary.</p> 
 
<label for="txt_wage">Hourly Wage:</label> 
 
<input type="text" name="wage" id="txt_wage" value ="0.00"/> 
 
\t \t \t \t \t 
 
<label for="txt_hours">Hours Per Week:</label> 
 
<input type="text" name="hours" id="txt_hours" value= "0.0"/> 
 
    <br/><br/> 
 
<button value="calculate" onclick="calcSalary()">Calculate</button> 
 
<p id="results"></p> 
 
</div>

Answer 2

あなたのコードは、問題があなたの代わりに値の要素を計算しているということです

var calculate = wage * hours * 52; 

Answer 3

に

var calculate = wage_element * hours_element * 52; 

を変更する必要がある調整する必要があります。

@ジェラードは分かりましたが、ここには動作コードがあります。

<div id="fulldiv"> 
 
\t \t <p> Enter the following information to calculate your annual salary.</p> 
 
\t \t \t \t \t 
 
\t \t <p>Hourly Wage: 
 
\t \t <input type="text" name="wage" id="txt_wage" value ="0.00"/></p> 
 
\t \t \t \t \t 
 
\t \t <p>Hours Per Week: 
 
\t \t <input type="text" name="hours" id="txt_hours" value= "0.0"/> <br/><br/> 
 
\t \t 
 
\t \t <button value="calculate" onclick="calcSalary()">Calculate</button></p> 
 
\t \t 
 
\t \t <p id="results"></p> 
 
\t \t \t \t \t 
 
\t \t <script type="text/javascript"> 
 
\t \t 
 
\t \t function calcSalary() { 
 
     var wage_element = document.getElementById('txt_wage'); 
 
     var wage = parseInt(wage_element.value); 
 
     var hours_element = document.getElementById('txt_hours'); 
 
     var hours = parseInt(hours_element.value); 
 
     
 
     var calculate = wage * hours * 52; 
 
     document.getElementById('results').innerHTML = calculate; 
 
\t \t } 
 
\t \t </script> 
 
\t \t \t \t 
 
\t \t \t \t \t 
 
\t \t \t \t 
 

 
</div>