一个简单的计算脚本,求高手指教

Question

计算点数的脚本, 勾选推荐, 需要点数10点/月.
勾选置顶, 需要点数10点/月, 增加一级增加10点, 即 2级置顶每月20点.我的水平太次, 每个地方都写了个函数, 如果这样, 统计总点数还要再写一个, 觉得非常繁琐, 而且也没有设置点数的地方,将来改点数不方便.希望高手能把它改成一个函数, 包括合计点数,且能在FF下用<table width="700" border="0" cellspacing="1" cellpadding="3">
  <tr>
    <td>是否推荐：</td>
    <td><input type="checkbox" name="isgood" onclick="CalFen(this,'tuiterm','tuifen')" /> 我要推荐，期限 <select name="tuiterm" id="tuiterm" onchange="termfen('tuiterm','tuifen')"><option value="1">1个月</option><option value="2">2个月</option><option value="3">3个月</option></select></td>
    <td>需要点数：<span id="tuifen"></span></td>
  </tr>
  <tr>
    <td>是否置顶：</td>
    <td><input type="checkbox" name="istop" onclick="topfen(this)" /> 我要置顶，置顶级别: <select name="toplevel" id="toplevel" onchange="tfchange()"><option value="1">1级</option><option value="2">2级</option><option value="3">3级</option></select>， 期限 <select name="topterm" id="topterm" onchange="tfchange()"><option value="1">1个月</option><option value="2">2个月</option><option value="3">3个月</option></select></td>
    <td>需要点数：<span id="pinfen"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>合计点数：<span id="totalfen"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2"><input type="submit" value="提交" class="btn" /> <input type="button" value="返回信息管理" /></td>
  </tr>
</table>function $(id){return document.getElementById(id);}
function termfen(id,id2){$(id2).innerHTML=$(id).value*10+" 点"; 
    }
function CalFen(obj,id,id2){if (obj.checked){termfen(id,id2);}
else{$(id2).innerHTML="";}
}
function topfen(obj){if (obj.checked){
tfchange();} else{$('pinfen').innerHTML="";}
}
function tfchange(){var tfen=$('toplevel').options.value*10+$('topterm').options.value*10; $('pinfen').innerHTML=tfen+" 点";
}

Answer 1

我觉得如果你想把这些方法整合成一个方法反而不好了，因为你的select 的change方法是调用相应的地，如果都整合到一起，难道每个select都调用一个方法么？结构会不清晰，而且也容易出问题。最后总分的可以写一个方法，然后在其他的方法里调用，例如tfchange（）里，这种，只要select项改变了，那总分也就应该相应改变，所以直接放在change方法里调用就可以了。

Answer 2

<table width="700" border="1" cellspacing="1" cellpadding="3">
  <tr>
    <td>是否推荐：</td>
    <td><input type="checkbox" name="isgood" onclick="operator(this)" /> 我要推荐，期限 <select name="tuiterm" id="tuiterm" onchange="operator(this)"><option value="1">1个月</option><option value="2">2个月</option><option value="3">3个月</option></select></td>
    <td>需要点数：<span id="tuifen"></span></td>
  </tr>
  <tr>
    <td>是否置顶：</td>
    <td><input type="checkbox" name="istop" onclick="operator(this)" /> 我要置顶，置顶级别: <select name="toplevel" id="toplevel" onchange="operator(this)"><option value="1">1级</option><option value="2">2级</option><option value="3">3级</option></select>， 期限 <select name="topterm" id="topterm" onchange="operator(this)"><option value="1">1个月</option><option value="2">2个月</option><option value="3">3个月</option></select></td>
    <td>需要点数：<span id="pinfen"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>合计点数：<span id="totalfen"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2"><input type="submit" value="提交" class="btn" /> <input type="button" value="返回信息管理" /></td>
  </tr>
</table>
<script>
function operator(_t)
{

var p = _t.parentNode;
var c = 1;
if(_t.tagName != "INPUT") _t = p.getElementsByTagName("input")?p.getElementsByTagName("input")[0]:null; if(!_t.checked)return;
var s = p.getElementsByTagName("select");
for(var i=0,o=null;o=s[i];i++)
{
c = c*parseInt(o.value,10);
}

p.nextSibling.getElementsByTagName("span")[0].innerHTML = c; c = 0;
var t = document.getElementsByTagName("table")[0];
for(var i=0,r=null;r=t.rows[i];i++ )
{
if(r.cells.length == 3)
{
s = r.cells[2].getElementsByTagName("span")[0];
if(s.id == "totalfen") continue;
c = c + parseInt( s.innerHTML?s.innerHTML:0,10);
}
}
document.getElementById("totalfen").innerHTML = c;
}
</script>
测试环境 ie6

Answer 3

onclick="setpoint(this,point,callback)"var totalPoint=0; //全局变量 保存总点数
srtpoint(check,point,callback){ //check 当前选中的按钮，point要操作的点数,callback回调函数
      if(check.checked){
             callback(point,true); // true表示选中
             totalPoint+=point;  //刷新总点数
      }else{
             cllback(point,false);  //false表示没有选择
             totalPoint-=point;  //刷新总点数
      }
}
抽象出来这一个方法就差不多够了

Answer 4

<table width="700" border="1" cellspacing="1" cellpadding="3">
  <tr>
    <td>是否推荐：</td>
    <td><input type="checkbox" name="isgood" onclick="operator(this)" /> 我要推荐，期限 <select name="tuiterm" id="tuiterm" onchange="operator(this)"><option value="1">1个月</option><option value="2">2个月</option><option value="3">3个月</option></select></td>
    <td>需要点数：<span id="tuifen"></span></td>
  </tr>
  <tr>
    <td>是否置顶：</td>
    <td><input type="checkbox" name="istop" onclick="operator(this)" /> 我要置顶，置顶级别: <select name="toplevel" id="toplevel" onchange="operator(this)"><option value="1">1级</option><option value="2">2级</option><option value="3">3级</option></select>， 期限 <select name="topterm" id="topterm" onchange="operator(this)"><option value="1">1个月</option><option value="2">2个月</option><option value="3">3个月</option></select></td>
    <td>需要点数：<span id="pinfen"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>合计点数：<span id="totalfen"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2"><input type="submit" value="提交" class="btn" /> <input type="button" value="返回信息管理" /></td>
  </tr>
</table>
<script>
function operator(_t)
{

var p = _t.parentNode;
var c = 1;
if(_t.tagName != "INPUT") _t = p.getElementsByTagName("input")?p.getElementsByTagName("input")[0]:null;
p.parentNode.tag = _t.checked;
var s = p.getElementsByTagName("select");
for(var i=0,o=null;o=s[i];i++)
{
c = c*parseInt(o.value,10);
}

p.nextSibling.getElementsByTagName("span")[0].innerHTML = c; c = 0;
var t = document.getElementsByTagName("table")[0];
for(var i=0,r=null;r=t.rows[i];i++ )
{
if(r.cells.length == 3)
{
s = r.cells[2].getElementsByTagName("span")[0];
if(s.id == "totalfen" || !r.tag) continue;
c = c + parseInt( s.innerHTML?s.innerHTML:0,10);
}
}
document.getElementById("totalfen").innerHTML = c;
}
</script>重新修改过的

Answer 5

<table width="700" border="0" cellspacing="1" cellpadding="3">
  <tr>
    <td>是否推荐：</td>
    <td>
<input type="checkbox" id="chk_isgood" name="chk_isgood" value="10" onclick="count('isgood')" /><!-- 这个value就是单价 -->
我要推荐，期限 
<select name="mons_isgood" id="mons_isgood" onchange="count('isgood')">
<option value="1">1个月</option>
<option value="2">2个月</option>
<option value="3">3个月</option>
</select>
</td>
    <td>需要点数：<span id="total_isgood"></span></td>
  </tr>
  <tr>
    <td>是否置顶：</td>
    <td>
<input type="checkbox" id="chk_istop" name="chk_istop" value="10" onclick="count('istop')" /><!-- 这个value就是单价 -->
我要置顶，置顶级别：
<select name="toplevel" id="level_istop" onchange="count('istop')">
<option value="1">1级</option>
<option value="2">2级</option>
<option value="3">3级</option>
</select>， 
期限 
<select name="topterm" id="mons_istop" onchange="count('istop')">
<option value="1">1个月</option>
<option value="2">2个月</option>
<option value="3">3个月</option>
</select>
</td>
    <td>需要点数：<span id="total_istop"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>合计点数：<span id="totalfen"></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2"><input type="submit" value="提交" class="btn" /> <input type="button" value="返回信息管理" /></td>
  </tr>
</table>
<SCRIPT LANGUAGE="JavaScript">
<!--
function $(id){return document.getElementById(id);}
function count(type) {
if ( $('chk_'+type).checked ) {
var total = parseInt( $('chk_'+type).value,10) * parseInt( $('mons_'+type).value,10);
if (type == "istop") total = total * parseInt( $('level_'+type).value,10);
$('total_'+type).innerHTML = total;
}
else $('total_'+type).innerHTML = "";
var totalG = isNaN( parseInt($('total_isgood').innerHTML,10) ) ? 0 : parseInt($('total_isgood').innerHTML,10);
var totalT = isNaN( parseInt($('total_istop').innerHTML,10) ) ? 0 : parseInt($('total_istop').innerHTML,10);
$("totalfen").innerHTML = totalG + totalT;
}
//-->
</SCRIPT>