Javascript 单选按钮的订单总计文本框
我正在为班级做一个项目，我们需要实现几个特性。现在，我一直关注的是，当用户使用ComputerForm中的单选按钮进行选择时，order total文本框中的值会自动更新。如果有人能告诉我，我应该如何脚本这将是非常感谢Javascript 单选按钮的订单总计文本框,javascript,html,textbox,radio-button,dom-events,Javascript,Html,Textbox,Radio Button,Dom Events,我正在为班级做一个项目，我们需要实现几个特性。现在，我一直关注的是，当用户使用ComputerForm中的单选按钮进行选择时，order total文本框中的值会自动更新。如果有人能告诉我，我应该如何脚本这将是非常感谢 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> Final: Computer Order Form </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="Joshua Aslan Smith">
<meta name="Keywords" content="">
<meta name="Description" content="Final Project">
<script type="text/javascript">
function doClear()
{
document.AddressForm.customer.value = "";
document.AddressForm.address.value = "";
document.AddressForm.city.value= "";
document.AddressForm.state.options[0].selected = "true";
document.AddressForm.zip.value = "";
document.AddressForm.phone.value= "";
document.AddressForm.email.value= "";
document.ComputerForm.cases[0].checked = false;
document.ComputerForm.cases[1].checked = false;
document.ComputerForm.cases[2].checked = false;
document.ComputerForm.monitors[0].checked = false;
document.ComputerForm.monitors[1].checked = false;
document.ComputerForm.monitors[2].checked = false;
document.ComputerForm.printers[0].checked = false;
document.ComputerForm.printers[1].checked = false;
document.ComputerForm.printers[2].checked = false;
return;
}
//function totalPrice()
//{
// var t1 = document.ComputerForm.cases.selected.value;
// var t2 = document.ComputerForm.monitors.selected.value;
// var t3 = document.ComputerForm.printers.selected.value;
// var total = document.AddressForm.total.value;
// total.value = t1.value + t2.value + t3.value;
// }
</script>
</head>
<body> <h1 align="center">Computer System Order Form</h1> <table border="black" cellpadding="10px" align="center"> <tr> <td>
<table cellpadding="10px">
<form name="ComputerForm">
<tr>
<td>
Computer Case Style:</br>
<input type="radio" name="cases" value="500.00" /> Desktop Case (500.00) </br>
<input type="radio" name="cases" value="600.00" /> Mini-Tower Case (600.00) </br>
<input type="radio" name="cases" value="700.00" /> Full-Tower Case (700.00) </br>
</td>
<td>
<img src="case.jpg" alt="pc case" >/>
</td>
</tr>
<tr>
<td>
Computer Monitor: <br/>
<input type="radio" name="monitors" value="250.00" /> 17" LCD Flat Screen (250.00) </br>
<input type="radio" name="monitors" value="300.00" /> 19" LCD Flat Screen (300.00) </br>
<input type="radio" name="monitors" value="350.00" /> 21" LCD Flat Screen (350.00) </br>
</td>
<td>
<img src="monitor.jpg" alt="pc >monitor" />
</td>
</tr>
<tr>
<td>
Computer Printer:<br/>
<input type="radio" name="printers" value="100.00" /> Inkjet Printer (100.00) </br>
<input type="radio" name="printers" value="250.00" /> Laser Printer (250.00) </br>
<input type="radio" name="printers" value="350.00" /> Color Printer (350.00) </br>
</td>
<td>
<img src="printer.jpg" alt="pc printer" />
</td>
</tr>
</form>
</table> </td> <td>
<table padding="10px">
<tr>
<form name="AddressForm">
<td>
Total System Price:
</td>
<td>
$<input type="text" name="total" readonly value="0.00" size="8">
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
Full Name:
</td>
<td>
<input type="text" name="customer" />
</td>
</tr>
<tr>
<td>
Street Address:
</td>
<td>
<input type="text" name="address" />
</td>
</tr>
<tr>
<td>
City:
</td>
<td>
<input type="text" name="city" />
</td>
</tr>
<tr>
<td>
State:
</td>
<td>
<select name="state">
<option value=""></option>
<option value="DE">DE</option>
<option value="NJ">NJ</option>
<option value="NY">NY</option>
<option value="PA">PA</option>
</select>
</td>
</tr>
<tr>
<td>
Zip:
</td>
<td>
<input type="text" name="zip" />
</td>
</tr>
<tr>
<td>
Phone Number:
</td>
<td>
<input type="text" name="phone" />
</td>
</tr>
<tr>
<td>
Email Address:
</td>
<td>
<input type="text" name="email">
</td>
</tr>
</form>
<tr>
<td>
</td>
</tr>
<tr>
<td>
<input type="button" value="Submit Order" onClick="doSubmit()" />
</td>
<td>
<input type="button" value="Clear Form" onClick="doClear()" />
</td>
</tr>
</table> </td> </tr> </table> </body> </html>
期末：电脑订购表格
函数doClear（）
{
document.AddressForm.customer.value=“”；
document.AddressForm.address.value=“”；
document.AddressForm.city.value=“”；
document.AddressForm.state.options[0]。selected=“true”；
document.AddressForm.zip.value=“”；
document.AddressForm.phone.value=“”；
document.AddressForm.email.value=“”；
document.ComputerForm.cases[0]。checked=false；
document.ComputerForm.cases[1]。checked=false；
document.ComputerForm.cases[2]。checked=false；
document.ComputerForm.monitors[0]。checked=false；
document.ComputerForm.monitors[1]。checked=false；
document.ComputerForm.monitors[2]。checked=false；
document.ComputerForm.printers[0]。选中=false；
document.ComputerForm.printers[1]。选中=false；
document.ComputerForm.printers[2]。选中=false；
返回；
}
//函数totalPrice（）
//{
//var t1=document.ComputerForm.cases.selected.value；
//var t2=document.ComputerForm.monitors.selected.value；
//var t3=document.ComputerForm.printers.selected.value；
//var total=document.AddressForm.total.value；
//total.value=t1.value+t2.value+t3.value；
// }
电脑系统订购表格
电脑机箱样式：
台式机箱（500.00）
迷你塔式机箱（600.00）
全塔箱（700.00）
/>
计算机显示器：
17英寸LCD平板屏幕（250.00）
19英寸LCD平板屏幕（300.00）
21英寸LCD平板屏幕（350.00）
监视器“/>
计算机打印机：
喷墨打印机（100.00）
激光打印机（250.00）
彩色打印机（350.00）
系统总价：
$
全名：
街道地址：
城市：
声明：
判定元件
新泽西州
纽约
帕
邮编：
电话号码：
电邮地址：
var prices = new Object();
function updateTotal () {
var total = 0.00;
for (var price in prices) {
total += price;
}
document.getElementById("total").value = total; // Add the id "total" to the input field
}
onchange="javascript:prices['cases'] = parseInt(this.value); updateTotal();"