jQuery表格动态添加删除行 上传者：JEASON-- 2025-05-27 05:37:21上传 ZIP文件 36.87KB 热度 1次 表格的动态增删操作一直挺常用的，尤其是在做一些数据录入或者管理页面的时候。jQuery本身就擅长搞定 DOM 操作，加上它事件绑定也方便，所以实现起来真不麻烦。 你只需要一个结构，再配上两个按钮，#addRow和#deleteRow，就能让用户自己控制数据的添加和删除，体验会好不少。 添加行直接，点击按钮就append()一行新的到。删行稍微注意点，要让用户能“选中”一行才好删，不然一口气删完可麻烦。 可以给每行加个点击事件，点了加个selected类，再用$('tr.selected')来删除，靠谱多了： $(document).ready(function() { $('#addRow').click(function() { var newRow = $('新数据 1新数据 2'); $('#myTable tbody').append(newRow); }); $('#myTable').on('click', 'tr', function() { $(this).toggleClass('selected'); }); $('#deleteRow').click(function() { $('#myTable tbody tr.selected').remove(); }); }); 样式上建议加点cursor: pointer，点起来更像“可以选中”的效果，用户感知会更清晰。 如果你还想折腾得更高级点，比如数据从后台来、加点动画啥的，也都可以在这个基础上继续加，jQuery 基本都能搞定。 另外还有一些类似的例子你也可以看看，像这个动态添加删除行的案例、jstable 复制行的用法，灵感不嫌多嘛。 如果你在做表格编辑功能，不妨试试这个方式，简单直接，维护也方便。 下载地址 用户评论 更多下载 下载地址 立即下载 用户评论 发表评论 JEASON-- 资源：2276 粉丝：0 +关注 上传资源 免责说明 本站只是提供一个交换下载平台，下载的内容为本站的会员网络搜集上传分享交流使用,有完整的也有可能只有一分部,相关内容的使用请自行研究,主要是提供下载学习交流使用,一般不免费提供其它各种相关服务! 本站内容泄及的知识面非常广,请自行学习掌握,尽量自已动脑动手解决问题,实践是提高本领的途径,下载内容不代表本站的观点或立场!如本站不慎侵犯你的权益请联系我们,我们将马上处理撤下所有相关内容！联系邮箱：server@dude6.com
