私はこれを動作させるのに苦労しています。私はかなりHTMLを表示することができます。私はJavascriptを初めて使いました。私はそれを動作させる方法がわかりません。具体的には、量の乗数、合計の列を追加し、これらの関数の結果を要素に表示することです。助けてください!Javascript Table Invoice
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<form>
<strong>Invoice #</strong>
<input class="countit">
<table>
<th>Item</th><th>Quantity</th><th>Price</th><th>Total</th>
<tr>
<td><select name="merch1" id="merch1" oninput="calcPrice('1')">
<option value="tshirt">T-Shirt</option>
<option value="longsleeve">Longsleeve</option>
<option value="hoodie">Hoodie</option>
<option value="cd">CD</option>
<option value="tape">Tape</option>
<option value="lp">LP</option>
</select>
</td>
<td><input type="number" min="0" name="quantity1" id="quantity1" oninupt="multiplyQuantity('1')"></td>
<td><input type="text" name="calculated1" id="calculated1" disabled></td>
<td><input onblur="findTotal()" type="text" name="pretotal" id="total1"></td>
</tr>
<br>
<tr>
<td><select name="merch2" id="merch2" oninput="calcPrice('2')">
<option value="tshirt">T-Shirt</option>
<option value="longsleeve">Longsleeve</option>
<option value="hoodie">Hoodie</option>
<option value="cd">CD</option>
<option value="tape">Tape</option>
<option value="lp">LP</option>
</select></td>
<td><input type="number" min="0" name="quantity2" id="quantity2" oninupt="multiplyQuantity('2')"></td>
<td><input type="text" name="calculated2" id="calculated2" disabled></td>
<td><input onblur="findTotal()" type="text" name="pretotal" id="total2"></td>
</tr>
<br>
<tr>
<td><select name="merch3" id="merch3" oninput="calcPrice('3')">
<option value="tshirt">T-Shirt</option>
<option value="longsleeve">Longsleeve</option>
<option value="hoodie">Hoodie</option>
<option value="cd">CD</option>
<option value="tape">Tape</option>
<option value="lp">LP</option>
</select></td>
<td><input type="number" min="0" name="quantity3" id="quantity3" oninupt="multiplyQuantity('3')"></td>
<td><input type="text" name="calculated3" id="calculated3" disabled></td>
<td><input onblur="findTotal()" type="text" name="pretotal" id="total3"></td>
</tr>
<br>
<tr>
<td></td>
<td></td>
<td style="text-align:right"><strong>Total:</strong></td>
<td><input type="text" name="total" id="total" disabled></td></tr>
</table>
<br>
<b>Comment:</b><br><textarea rows="4" cols="50"></textarea><br>
<button type="submit" value="Submit">Submit</button>
<button type="reset" value="Reset">Reset</button>
</form>
<script language="javascript" type="text/javascript">
function calPrice(x){
var item = document.getElementById("merch"+i).value;
var price;
switch(item){
case("tshirt"):
price = 10;
break;
case("longsleeve"):
price = 20;
break;
case("hoodie"):
price = 26;
break;
case("cd"):
price = 10;
break;
case("tape"):
price = 7;
break;
case("lp"):
price = 17;
break;
}
document.getElementById("price"+i).value = price;
}
function multiplyQuantity(){
var "calculated"+y = price * document.getElementById("quantity"+y).value;
document.getElementById("total"+y).value = calculated;
}
function findTotal(){
var arr = document.getElementsByName('pretotal')
var tot=0;
for(var i=0;i<arr.length;i++){
if(parseInt(arr[i].value))
tot += parseInt(arr[i].value);
}
document.getElementById('total').value = tot;
}
</script>
</body>
</html>