withbyfan 2022-03-16 02:07 采纳率: 100%
浏览 58
已结题

新学html和js 求解答函数使用问题

问题出在 function calcTotal(table,column)这个函数中变量td取不到值
以下是代码


<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            caption {
                font-size: 28px;
                line-height: 50px;
                color: blue;
            }
            td {
                text-align: center;
            }
            form {
                border-right: 100px;
                
                line-height: 30px;
            }
            input {
                margin-left: 10px;
            }
        </style>
    </head>
    <body>
        <form name="form1">
            姓名:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input name="name"><br>
            性别:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input name="sex"><br>
            电子邮件:<input name="email"><br>
            联系电话:<input name="tel"><br>
            收入:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input name="inco"><br>
            <input type="button" value="显示总收入" onclick="SumShow()">
            <input type="reset" value="重置">
            
        </form>
        <div id="info"></div>
        <table id="cj" cellspacing="0" width="100%" align="center" border="1">
            <caption>学生信息统计表</caption>
            <tr>
                <th>姓名</th>
                <th>性别</th>
                <th>电子邮件</th>
                <th>联系电话</th>
                <th>收入</th>
            </tr>

            <tr>
                <td>Example</td>
                <td>bb</td>
                <td>cc</td>
                <td>123</td>
                <td>200</td>
            </tr>
        </table>
        <h2 id="demo"></h2>
        
        <script>
            function addTable(stu) {
                var tab = document.getElementById("cj")
                var colsNum  = 5;
                rs = tab.insertRow(tab.rows.length);
                for(var i = 0;i<colsNum;i++)
                    rs.insertCell(i);
                rs.cells[0].innerHTML = stu.name;
                rs.cells[1].innerHTML = stu.sex;
                rs.cells[2].innerHTML = stu.email;
                rs.cells[3].innerHTML = stu.tel;
                rs.cells[4].innerHTML = stu.inco;
                
            }
            function Student(name,sex,email,tel,inco) {
                this.name = name;
                this.sex = sex;
                this.email = email;
                this.tel = tel;
                this.inco = parseFloat(inco);
            }
            var count ;
            var students = new Array();
            var info = document.getElementById('info');
          
            function SumShow() {
                with(form1) {
                    if(elements[0].value == "") {
                        info.innerHTML = "姓名不能为空";
                        return ;
                    }
                    for(var i = 3;i<5;i++) {
                        var s = elements[i].value;
                        if(isNaN(s)) {
                            info.innerHTML = "请输入真实数据";
                            return ;
                        }
                    }
                    stu = new Student(elements[0].value,elements[1].value,elements[2].value,elements[3].value,elements[4].value);
                    info.innerHTML = "";
                    students[count] = stu;
                    count++;
                    addTable(stu);
                    document.getElementById("demo").innerHTML=calcTotal("cj",4);
                }
            }
                function calcTotal(table,column){
                var trs=table.getElementsByTagName('tr');
                var start=1,end=trs;
                var total=0;
                for(var i=start;i<end;i++){
                    var td=trs[i].getElementsByTagName('td')[column];
                    var t=parseFloat(td.innerHTML);
                    if(t)total+=t;
                    return(total);
                }
            };

            document.getElementById("demo").innerHTML=calcTotal(document.getElementById('cj'),4);
        </script>
    </body>
</html>

这是运行结果

img

这是变量的当前值

img

  • 写回答

2条回答 默认 最新

  • 关注

    calcTota函数中var start=1,end=trs之后少了.length
    return total; 放循环之外

    SumShow函数中

    document.getElementById("demo").innerHTML=calcTotal('cj',4);  //'cj'改成 document.getElementById('cj')
    document.getElementById("demo").innerHTML=calcTotal(document.getElementById('cj'),4);
    

    你题目的解答代码如下:

                function addTable(stu) {
                    var tab = document.getElementById("cj")
                    var colsNum  = 5;
                    rs = tab.insertRow(tab.rows.length);
                    for(var i = 0;i<colsNum;i++)
                        rs.insertCell(i);
                    rs.cells[0].innerHTML = stu.name;
                    rs.cells[1].innerHTML = stu.sex;
                    rs.cells[2].innerHTML = stu.email;
                    rs.cells[3].innerHTML = stu.tel;
                    rs.cells[4].innerHTML = stu.inco;
                    
                }
                function Student(name,sex,email,tel,inco) {
                    this.name = name;
                    this.sex = sex;
                    this.email = email;
                    this.tel = tel;
                    this.inco = parseFloat(inco);
                }
                var count ;
                var students = new Array();
                var info = document.getElementById('info');
              
                function SumShow() {
                    with(form1) {
                        if(elements[0].value == "") {
                            info.innerHTML = "姓名不能为空";
                            return ;
                        }
                        for(var i = 3;i<5;i++) {
                            var s = elements[i].value;
                            if(isNaN(s)) {
                                info.innerHTML = "请输入真实数据";
                                return ;
                            }
                        }
                        stu = new Student(elements[0].value,elements[1].value,elements[2].value,elements[3].value,elements[4].value);
                        info.innerHTML = "";
                        students[count] = stu;
                        count++;
                        addTable(stu);
                        document.getElementById("demo").innerHTML=calcTotal(document.getElementById('cj'),4);  //'cj'改成 document.getElementById('cj')
                    }
                }
                function calcTotal(table,column){
                    var trs=table.getElementsByTagName('tr');
                    var start=1,end=trs.length;  //加上.length
                    var total=0;
                    for(var i=start;i<end;i++){
                        var td=trs[i].getElementsByTagName('td')[column];
                        var t=parseFloat(td.innerHTML);
                        if(t)total+=t;
                    }
                    return total; //放循环之外
                };
     
                document.getElementById("demo").innerHTML=calcTotal(document.getElementById('cj'),4);
    

    如有帮助,请点击我的回答下方的【采纳该答案】按钮帮忙采纳下,谢谢!

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 3月29日
  • 已采纳回答 3月21日
  • 创建了问题 3月16日

悬赏问题

  • ¥15 对于这个问题的代码运行
  • ¥50 三种调度算法报错 有实例
  • ¥15 关于#python#的问题,请各位专家解答!
  • ¥200 询问:python实现大地主题正反算的程序设计,有偿
  • ¥15 smptlib使用465端口发送邮件失败
  • ¥200 总是报错,能帮助用python实现程序实现高斯正反算吗?有偿
  • ¥15 对于squad数据集的基于bert模型的微调
  • ¥15 为什么我运行这个网络会出现以下报错?CRNN神经网络
  • ¥20 steam下载游戏占用内存
  • ¥15 CST保存项目时失败