页面环境:页面上有一个总金额输入框,下方有4个复选框表明产品系列,每个产品系列后跟一个输入框。
求助实现功能:当总金额框中输入金额后,点击下方产品复选框,上方总金额除以点击复选框产品系列的选定个数,如选定一个,就除以1 选定其中2个就除以2,并在选定产品系列后方输入框内显示平均数,且平均数取整汇总等于总金额。求大家如何实现。小弟,万分感谢,先将环境页面HTML代码奉上,望哪位大侠帮助!<!DOCTYPE   HTML   PUBLIC   "-//W3C//DTD   HTML   4.01   Transitional//EN">   
  <html>   
  <head>   
  <meta http-equiv="Content-Language" content="zh-cn">
  <title>Untitled   Document</title>   
  <meta   http-equiv="Content-Type"   content="text/html; charset=gb2312">   
     
  </head>   
    
  <body>   
  <form   >   
  <p>总金额 <input   type="text"   name="sum"   ></p>
  <table   width="75%"   border="1">   
      <tr>   
          <td   width="24%"><input   type="checkbox"   name="check"       >产品系列A</td>   
          <td   width="76%">平均金额 <input   type="text"   name="A"   value="0"></td>   
      </tr>   
      <tr>   
          <td><input   type="checkbox"   name="check"     >产品系列B</td>   
          <td>平均金额 <input   type="text"   name="B"   value="0"></td>   
      </tr>   
      <tr>   
          <td><input   type="checkbox"   name="check"     >产品系列C</td>   
          <td>平均金额 <input   type="text"   name="C"   value="0"></td>   
      </tr>   
      <tr>   
          <td><input   type="checkbox"   name="check"     >产品系列D</td>   
          <td>平均金额 <input   type="text"   name="D"   value="0"></td>   
      </tr>   
  </table>   
  </form>   
  </body>   
  </html>   

解决方案 »

  1.   


    <script>
    function doit(){
    var f = document.forms[0];
    var sum = f.sum.value;
    if(isNaN(sum) || sum=="") return;
    sum = parseInt(sum,10);
    var a = [];
    var A = "A".charCodeAt(0)
    for(var i=0;i<f.check.length;i++){
    if(f.check[i].checked) a[a.length] = f.elements[String.fromCharCode(A + i)];
    }
    var av = sum / a.length
    for(var i=0;i<a.length;i++) a[i].value = parseInt(av,10);
    }
    </script>
    <form> 
      <p>总金额<input type="text" name="sum"></p> 
      <table width="75%" border="1">
          <tr>  
              <td width="24%"><input type="checkbox" name="check" onclick="doit()">产品系列A</td>  
              <td width="76%">平均金额 <input type="text" name="A" value="0"></td>  
          </tr>  
          <tr>  
              <td><input type="checkbox" name="check" onclick="doit()">产品系列B</td> 
              <td>平均金额 <input type="text" name="B" value="0"></td>  
          </tr>  
          <tr>  
              <td><input type="checkbox" name="check" onclick="doit()">产品系列C</td>  
              <td>平均金额 <input type="text" name="C" value="0"></td>  
          </tr>  
          <tr>  
              <td><input type="checkbox" name="check" onclick="doit()">产品系列D</td>  
              <td>平均金额 <input type="text" name="D" value="0"></td>  
          </tr>
      </table>
    </form>
      

  2.   

    总金额决定平均数,还是平均数决定总金额不过这不是关键,你自己清楚就成了。
    这个问题只要知道如何绑定事件,参考如下代码:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html><head>
    </head>
    <body>
    <form>
    <p>总金额 <input type="text" name="sum"></p>
    <table width="75%" border="1">
    <tr>
    <td width="24%"><input type="checkbox" name="check">产品系列A </td>
    <td width="76%">平均金额 <input type="text" name="A"value="0"></td>
    </tr>
    <tr>
    <td><input type="checkbox" name="check">产品系列B</td>
    <td>平均金额 <input type="text" name="B" value="0"></td>
    </tr>
    <tr>
    <td><input type="checkbox" name="check">产品系列C</td>
    <td>平均金额 <input type="text" name="C" value="0"></td>
    </tr>
    <tr>
    <td><input type="checkbox" name="check">产品系列D</td>
    <td>平均金额 <input type="text" name="D" value="0"></td>
    </tr>
    </table>
    </form>
    <script>
    (function() {
    var checks = document.getElementsByName("check");
    for(var i = 0; i < checks.length; i++) {
    checks[i].onclick = function() { 
    alert(this.parentNode.parentNode.getElementsByTagName("input")[1].value);
    //this checkbox
    //this.parentNode td
    //this.parentNode.parentNode tr
    //this.parentNode.parentNode.getElementsByTagName("input")[1] <input type="text" name="xxx">
    };
    }
    })();
    </script>
    </body>
    </html>
      

  3.   

    感谢 hookee,基本上是这样实现,有个问题,就是当不选择某一产品时,后面相对应的输入框如何清零?本人对JS基本文盲,请赐教,谢谢
      

  4.   

    请高手再修改一下HOOKEE的程序,当取消复选框时,后面的输入框归零。拜托
      

  5.   


    <script>
    function doit(){
    var f = document.forms[0];
    var sum = f.sum.value;
    if(isNaN(sum) || sum=="") return;
    sum = parseInt(sum,10);
    var a = [];
    var A = "A".charCodeAt(0)
    for(var i=0;i<f.check.length;i++){
    if(f.check[i].checked) a[a.length] = f.elements[String.fromCharCode(A + i)];
    else f.elements[String.fromCharCode(A + i)].value = "";
    }
    var av = sum / a.length
    for(var i=0;i<a.length;i++) a[i].value = parseInt(av,10);
    }
    </script>
    <form> 
      <p>总金额<input type="text" name="sum"></p> 
      <table width="75%" border="1">
          <tr>  
              <td width="24%"><input type="checkbox" name="check" onclick="doit()">产品系列A</td>  
              <td width="76%">平均金额 <input type="text" name="A" value="0"></td>  
          </tr>  
          <tr>  
              <td><input type="checkbox" name="check" onclick="doit()">产品系列B</td> 
              <td>平均金额 <input type="text" name="B" value="0"></td>  
          </tr>  
          <tr>  
              <td><input type="checkbox" name="check" onclick="doit()">产品系列C</td>  
              <td>平均金额 <input type="text" name="C" value="0"></td>  
          </tr>  
          <tr>  
              <td><input type="checkbox" name="check" onclick="doit()">产品系列D</td>  
              <td>平均金额 <input type="text" name="D" value="0"></td>  
          </tr>
      </table>
    </form>
      

  6.   

    function doit(){
        var f = document.forms[0];
        var sum = f.sum.value;
        if(isNaN(sum) || sum=="") return;
        sum = parseInt(sum,10);
        var a = [];
        var b = [];
        var A = "A".charCodeAt(0)
        for(var i=0;i<f.check.length;i++){
            if(f.check[i].checked) a[a.length] = f.elements[String.fromCharCode(A + i)];
        }
        for(var i=0;i<f.check.length;i++){
            if(!f.check[i].checked) b[b.length] = f.elements[String.fromCharCode(A + i)];
        }
        var av = sum / a.length
        for(var i=0;i<a.length;i++) a[i].value = parseInt(av,10);
        for(var i=0;i<b.length;i++) b[i].value = 0;
    }
    </script>