zoukankan      html  css  js  c++  java
  • 总结5.12js代表练习题

    <body>
        <table border="1px">
            <tr>
                <td>年级</td>
                <td>性别</td>
                <td>姓名</td>
                <td>操作</td>
            </tr>
            <tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>
                <td><button class="a">删除</button></td>
            </tr>
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>
                <td><button class="a">删除</button></td>
            </tr>
            <tr>
                <td>7</td>
                <td>8</td>
                <td>9</td>
                <td><button class="a">删除</button></td>
            </tr>
        </table>
        <button class="b">添加</button>
    </body>
    <script src="../week four/jquery-3.4.1.js"></script>
    <script>
        $('body').on('click','.b',function(){
            $('table').append('<tr><td>1</td><td>2</td><td>3</td><td><button class="a">删除</button></td></tr>')
        });//点击添加按钮的动态事件,在table内部尾端添加新的tr
        $('body').on('click','.a',function(){
            $(this).parents('tr').remove();
        });//点击删除按钮的动态事件,删除掉此条tr
        $('body').on('click','td',function() {
            var text = $(this).text();
            $(this).html('<input type="text">');
            $(this).children().val(text);
        });//点击td框的动态事件,创建文本框来输入内容
        $('body').on('click','input',function(){
            return false;
        });//阻止默认行为(如链接),防止冒泡
        $('body').on('blur','input',function(){
            var val = $(this).val();
            $(this).parent().text(val);
        });//鼠标移开编辑的文本框后,将文本框的内容传递给父级元素,即td

    </script>
  • 相关阅读:
    O'Reilly总裁提姆奥莱理:什么是Web 2.0
    在MFC程序中显示JPG/GIF图像
    VC窗体设计集锦
    VxWorks使用说明书
    关于双缓冲绘图之二
    如何将EVC4工程升级到VS.NET2005工程
    某个正在运行的程序的CPU占用率
    如何去掉回车键和取消键
    探索NTFS
    ARM上的C编程
  • 原文地址:https://www.cnblogs.com/HighKK/p/12879166.html
Copyright © 2011-2022 走看看