还是把源文件贴上来，大大给看看
实现sum的值＝a3＋total，并且随myform复选框的不同勾选，sum值相应变化。谢谢。
-------------------------------------------------------------------------------------------
<HTML>
<HEAD>
<META http-equiv='Content-Type' content='text/html; charset=gb2312'>
<TITLE>自动计算</TITLE>
<script type="text/javascript">
var mh = 30;
var step = 5;
var ms = 10;
function toggle(o,u){
if (!o.tid)o.tid = "_" + Math.random() * 100;
if (!window.toggler)window.toggler = {};
if (!window.toggler[o.tid]){
window.toggler[o.tid]={
obj:o,
maxHeight:o.offsetHeight,
minHeight:mh,
timer:null,
action:1
};
}
if(u){
o.style.height = mh + "px";
}
o.style.height = o.offsetHeight + "px";
if (window.toggler[o.tid].timer)clearTimeout(window.toggler[o.tid].timer);
window.toggler[o.tid].action *= -1;
window.toggler[o.tid].timer = setTimeout("anim('"+o.tid+"')",ms );
}
function anim(id){
var t = window.toggler[id];
var o = window.toggler[id].obj;
if (t.action < 0){
if (o.offsetHeight <= t.minHeight){
o.style.height = mh + "px"
clearTimeout(t.timer);
return;
}
}
else{
if (o.offsetHeight >= t.maxHeight){
clearTimeout(t.timer);
return;
}
}
o.style.height = (parseInt(o.style.height, 10) + t.action * step) + "px";
window.toggler[id].timer = setTimeout("anim('"+id+"')",ms );
}
</script>
<style type="text/css">
div.xx{border:solid 0px;overflow:hidden;}
div.xx h5{border:solid 0px;border-width:0 0 0px;padding:0;margin:0;height:6px;line-height:12px;cursor:pointer;background:#f3f3f3;}
.unnamed1 {
font-size: 9px;
}
</style>
<style>
td {
font-size:9pt;
font-family: Verdana, Arial;
color: #000000;
}
a{
TEXT-DECORATION:none;
font-family: Verdana, Arial;
color: #004e98;
font-size:9pt;
}
a:hover {
color: #ff0000;
text-decoration: underline;
font-family: Verdana, Arial;
font-size:9pt;
}
</style>
</HEAD>
<BODY onLoad="InitForm();">
<p align="left"><font color="#FF0000" face="Arial">
<script language="JavaScript">
<!-- Begin
<!-- begin cloaking from non-JavaScript browsers.
var form_total=0;
//Define function to manipulate the form total per item selected/deselected:
function CheckChoice(whichbox)
{
if (whichbox.checked == false)
{ form_total -= eval(whichbox.value); }
else
{ form_total += eval(whichbox.value); }
//Re-set displayed total on form:
document.myform.total.value = '￥'+eval(form_total);
}
//Define function to init the form on reload:
function InitForm()
{
//Reset the displayed total on form:
document.myform.total.value='￥0';
//Set all checkboxes on form to unchecked:
for (xx=0; xx < document.myform.elements.length; xx++)
{
if (document.myform.elements[xx].type == 'checkbox')
{
document.myform.elements[xx].checked = false;
}
}
}
// end cloaking -->
// End -->
function result(){
var a1=parseFloat(document.form1.a1.value);
var a2=parseFloat(document.form1.a2.value);
if(document.form1.a1.value!="" && document.form1.a2.value!="")
document.form1.a3.value=a1*a2;
if(document.form1.a3.value!="" && document.myform.total.value!="")
document.myform.sum.value=document.form1.a3.value+document.myform.total.value;
}
</script>
</font></p>
<form name="form1" action="">
<table width="960" border="1" cellpadding="0" cellspacing="1" bordercolor="#CCCCCC">
<tr>
<td bgcolor="#CCCCCC"> <div align="left"><font color="#FFFFFF" face="Arial">请输入数量：
</font>
<input name="a1" type="text" onBlur="result();" value="" size="12">
×
<input name="a2" type="text" onBlur="result();" value="10.00" size="6">
元/设备 ＝
<input name="a3" type="text" value="" size="12">
</div></td>
</tr>
</table>
</form>
<form method="POST" name="myform">
<table width="960" border="0" cellpadding="0" cellspacing="0" bordercolor="#FFFFFF">
<tr>
<td width="751" height="49"> <div align="left"><font face=Arial>
<input type="text" name="total" readonly onFocus="this.blur();">
</font></div></td>
<td width="84"><div align="right"><font size="4"><strong>Total:</strong></font><br>
<font face="Arial"></font></div></td>
<td width="125"><div align="right"><font face=Arial>
<input name="sum" type="text" id="sum" value="" size="18">
</font></div></td>
</tr>
</table>
<table width="960" border="0" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr bgcolor="#99ABB9">
<td height="17" colspan="4">
<div align="left"><font color="#FFFFFF" face="Arial"><strong>请选择</strong></font></div></td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="225" height="17">
<div align="center"><font face=Arial>A0 ￥750
<input type="checkbox" name="Steak" value=750 onClick="CheckChoice(this);">
</font></div></td>
<td width="228"><div align="center"><font face=Arial> B0 ￥590
<input type="checkbox" name="Chicken" value=590 onClick="CheckChoice(this);">
</font></div></td>
<td width="225"><div align="center"><font face=Arial> C0 ￥440
<input type="checkbox" name="Sushi" value=440 onClick="CheckChoice(this);">
</font></div></td>
<td width="229"><div align="center"><font face=Arial>D0 ￥300
<input type="checkbox" name="Sushi5" value=300 onClick="CheckChoice(this);">
<font color="#FF0000"><strong>(推荐) </strong></font></font></div></td>
</tr>
<tr bgcolor="#FFFFFF">
<td colspan="4"><div class="xx" id="xx3">
<h5 onclick="toggle(this.parentNode)">+</h5>
<p> </p>
<p>展开后显示的内容<br>
</p>
</div></td>
</tr>
</table>
<br>
<table width="960" height="74" border="0" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr bgcolor="#99ABB9">
<td height="17" colspan="10"><font color="#FFFFFF" face=Arial><strong><em></em>选择</strong></font></td>
</tr>
<tr>
<td width="96" bgcolor="f3f3f3"><div align="right"><font face=Arial>+1</font></div></td>
<td width="96" bgcolor="#FFFFFF"><font face=Arial>￥ 30
<input type="checkbox" name="Sushi2" value=30 onClick="CheckChoice(this);">
</font></td>
<td width="96" bgcolor="f3f3f3"><div align="right"><font face=Arial>+2</font></div></td>
<td width="96" bgcolor="#FFFFFF"><font face=Arial>￥ 60
<input type="checkbox" name="Sushi22" value=60 onClick="CheckChoice(this);">
</font></td>
<td width="96" bgcolor="f3f3f3"> </td>
<td width="96" bgcolor="#FFFFFF"> </td>
<td width="96" bgcolor="f3f3f3"> </td>
<td width="96" bgcolor="#FFFFFF"> </td>
<td width="96" bgcolor="f3f3f3"> </td>
<td width="96" bgcolor="#FFFFFF"> </td>
</tr>
<tr>
<td bgcolor="#FFFFFF"><div align="right"><font face=Arial>-1</font></div></td>
<td bgcolor="f3f3f3"><font face=Arial>￥-30
<input type="checkbox" name="Sushi3" value=-30 onClick="CheckChoice(this);">
</font></td>
<td bgcolor="#FFFFFF"><div align="right"><font face=Arial>-2</font></div></td>
<td bgcolor="f3f3f3"><font face=Arial>￥-60
<input type="checkbox" name="Sushi32" value=-60 onClick="CheckChoice(this);">
</font></td>
<td bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
</tr>
</table>
<br>
<table width="960" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="479" rowspan="2"><table width="453" height="97" border="0" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr bgcolor="#99ABB9">
<td colspan="4"><font color="#FFFFFF" face="Arial"><strong><font color="#000000" size="5"></font>请选择</strong></font></td>
</tr>
<tr bgcolor="#FFFFFF">
<td colspan="2"><div align="center">1</div></td>
<td colspan="2"><div align="center">2</div></td>
</tr>
<tr bgcolor="#f3f3f3">
<td width="110"> <div align="center">5×8</div></td>
<td width="112"><font face="Arial">￥-20
<input type="checkbox" name="Sushi35232" value=-20 onClick="CheckChoice(this);">
</font></td>
<td width="118" bgcolor="#f3f3f3"> <div align="center">5×12</div></td>
<td width="108"><font face="Arial">￥50
<input type="checkbox" name="Sushi352322" value=50 onClick="CheckChoice(this);">
</font></td>
</tr>
</table></td>
<td width="481" height="67" valign="top"> <table width="100%" height="37" border="0" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr bgcolor="#99ABB9">
<td colspan="2"><font color="#FFFFFF" face="Arial"><strong><font color="#000000" size="5"></font>请选择：</strong></font></td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="126"><font face="Arial">￥100
<input type="checkbox" name="Sushi352352" value=100 onClick="CheckChoice(this);">
</font></td>
<td width="269"></td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
</tr>
</table>
<p><font face=Arial><font> </font> </font> </p>
</form>
</BODY>
</HTML>
<script type="text/javascript">
toggle(document.getElementById("xx3"),"u");
</script>
[
本帖最后由 一米月光 于 2010-9-24 13:08 编辑 ]
