乗算フォーム値は、私はあなたが章で本を注文することが可能なウェブサイトを作成しようとしている

Question

<form> 
Chapter 1 - Please enter how many copys you would like <br> 
<input type="text" id="chap1"> <br><br> 
Chapter 2 - Please enter how many copys you would like <br> 
<input type="text" id="chap2"> <br><br> 
Chapter 3 - Please enter how many copys you would like <br> 
<input type="text" id="chap3"> <br><br> 
Chapter 4 - Please enter how many copys you would like <br> 
<input type="text" id="chap4"> <br><br> 
Chapter 5 - Please enter how many copys you would like <br> 
<input type="text" id="chap5"> <br><br> 
    <b> Total price : <output id = "total"> 0 </output> </b> 

、各章では、£2かかります。個々の書式の値に2を掛けて、このコストを出力に表示する必要があります。 jQueryではなくjavaスクリプトを使用したいと思います。

私はまだ多くの試みをしていませんでしたので、正しい方向に指針を付けることができます。

おかげ

Answer 1

function calc(){ 
    price = 2; 
    fields = document.querySelectorAll("input[id^='chap']"); 
    tot = 0; 
    for(i=0; i<fields.length; i++){ 
     tot += fields[i].value * price; 
    } 
    document.getElementById("total").innerHTML = tot; 
} 

これは単純な例です、あなたはそれが

Answer 2

fiddle link

<input type="text" id="chap1"> 
<input type="text" id="chap2"> 
<input type="text" id="chap3"> 
<input type="text" id="chap4"> 
<input type="text" id="chap5"> 
<b> Total price : <output id = "total"> 0 </output> </b> 
<button onclick="myFunction()">Click me</button> 
<script> 
function myFunction() { 
var text1= document.getElementById("chap1").value; 
var text2= document.getElementById("chap2").value; 
var text3= document.getElementById("chap3").value; 
var text4= document.getElementById("chap4").value; 
var text5= document.getElementById("chap5").value; 
var total=parseInt(text1)+parseInt(text2)+parseInt(text3)+parseInt(text4)+parseInt(text5); 
document.getElementById("total").innerHTML = total*2.1; 
} 
</script>