想了2小时终于找到一个还凑合的方法,但有点问题,大神来帮忙

来源:9-22 编程练习

qq_灰色头像_17

2017-09-23 17:54

1,经过事件精确到一小格了,但是感觉代码有点多,用&&或者||不起作用。

2.添加一行或者删除一行代码,序号名字可以自动排列了,但是删除的时候会把前两个名字也修改了,这是代码问题。我想让函数从删除的那一行的下一个开始chenge,可是不知道怎么写,

写回答 关注

5回答

  • NOBOUND0323
    2018-01-10 23:04:07

    请问楼主add()函数的最后两个循环是什么作用?bgcChange是啥?

  • web前端小白进阶
    2017-11-20 17:38:32

    你是想要删除一个人之后,把所有人的信息调整过来吧,那你可以在删除函数后调用一个重新排序命名的函数,排序简单,然后名字的话可以弄一个IF语句判断,如果名字的第一个字是‘’第‘’则按顺序修改为"第" + i + "个",如果不是的话,就不修改

  • web前端小白进阶
    2017-11-20 17:15:51

    经过事件应该给tr添加,给td添加就是一小格了

  • 爱上慕婉清6262634
    2017-09-26 19:48:11

    <!DOCTYPE html>

    <html>

        <head>

            <title> new document </title>  

            <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>

            <script type="text/javascript">

                window.onload = function () {

                    // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。

                    var tr = document.getElementsByTagName("tr");

                    for (i = 0; i < tr.length; i++) {

                        bg(tr[i]);

                    }

                }

                function bg(obj) {

                    obj.onmouseover = function () {

                        obj.style.backgroundColor = "#fff222";

                    }

                    obj.onmouseout = function () {

                        obj.style.backgroundColor = "#ffffff";

                    }

                }

                // 编写一个函数,供添加按钮调用,动态在表格的最后一行添加子节点;

                var num = 2;

                function add() {

                    num++;

                    var tr = document.createElement("tr");

                    var xh = document.createElement("td");

                    var xm = document.createElement("td");

                    var sc = document.createElement("td");

                    var table = document.getElementById("table");

                    if (num < 10) {

                        xh.innerHTML = "xh00" + num;

                    } else if (num > 99) {

                        xh.innerHTML = "xh" + num;

                    } else {

                        xh.innerHTML = "xh0" + num;

                    }

                    xm.innerHTML = "第" + num + "个";

                    sc.innerHTML = "<a href='javascript:;' onclick='del(this);'>删除</a>"

                    tr.appendChild(xh);

                    tr.appendChild(xm);

                    tr.appendChild(sc);

                    table.appendChild(tr);

                    var tr = document.getElementsByTagName("tr");

                     for (i = 1; i < tr.length; i++) {

                        if (i < 10) {

                            tr[i].childNodes[0].innerHTML = "xh00" + i;

                        } else if (i > 99) {

                            tr[i].childNodes[0].innerHTML = "xh" + i;

                        } else {

                            tr[i].childNodes[0].innerHTML = "xh0" + i;

                        }

                        tr[i].childNodes[1].innerHTML = "第" + i + "个";

                    }

                      for (i = 0; i < tr.length; i++) {

                        bg(tr[i]);

                    }

                }

                // 创建删除函数

                function del(obj) {

                    var sc = obj.parentNode.parentNode;

                    sc.parentNode.removeChild(sc);

                    var tr = document.getElementsByTagName("tr");

                    for (i = 1; i < tr.length; i++) {

                        if (i < 10) {

                            tr[i].childNodes[0].innerHTML = "xh00" + i;

                        } else if (i > 99) {

                            tr[i].childNodes[0].innerHTML = "xh" + i;

                        } else {

                            tr[i].childNodes[0].innerHTML = "xh0" + i;

                        }

                        tr[i].childNodes[1].innerHTML = "第" + i + "个";

                    }

                   

                }

            </script>    

        </head> 

        <body> 

            <table border="1" width="50%" id="table">

                <tr>

                    <th>学号</th>

                    <th>姓名</th>

                    <th>操作</th>

                </tr>  


                <tr><td>xh001</td><td>王小明</td><td><a href="javascript:;" onclick="del(this);">删除</a></td></tr>


                <tr><td>xh002</td><td>刘小芳</td><td><a href="javascript:;" onclick="del(this);">删除</a></td></tr>  


            </table>

            <input type="button" value="添加一行"  onclick="add();"/>   <!--在添加按钮上添加点击事件  --> 

           

        </body>

    </html>


    爱上慕婉清6... 回复qq_灰色头...

    tr[i].childNodes[1].innerHTML = "第" + i + "个";这行代码不应该存在,会把人员名字改变

    2017-09-28 09:58:05

    共 2 条回复 >

  • 有无上涯
    2017-09-23 23:42:26

    加油,我是混积分的

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468192 学习 · 21891 问题

查看课程

相似问题