jQuery实现html表格动态添加新行的方法


Posted in Javascript onMay 28, 2015

本文实例讲述了jQuery实现html表格动态添加新行的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Add Row example</title>
<script src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
<!-- jQuery Code will go underneath this -->
$(document).ready(function () {  
 // Code between here will only run when the document is ready
 $("a[name=addRow]").click(function() {
  // Code between here will only run 
  //when the a link is clicked and has a name of addRow
  $("table#myTable tr:last").after('<tr><td>Row 4</td></tr>');
  return false;
 });
});
</script>
</head>
<body>
<table style="width: 100%" id="myTable">
<tr><td>Row 1</td></tr>
<tr><td>Row 2</td></tr>
<tr><td>Row 3</td></tr>
</table>
<a href="#" name="addRow">Add Row</a>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
javascript document.execCommand() 常用解析
Dec 14 Javascript
jquery创建表格(自动增加表格)代码分享
Dec 25 Javascript
JQuery设置时间段下拉选择实例
Dec 30 Javascript
js选项卡的实现方法
Feb 09 Javascript
Js为表单动态添加节点内容的方法
Feb 10 Javascript
Redis基本知识、安装、部署、配置笔记
Mar 05 Javascript
jquery制作属于自己的select自定义样式
Nov 23 Javascript
jQuery获得字体颜色16位码的方法
Feb 20 Javascript
jQuery使用$.each遍历json数组的简单实现方法
Apr 18 Javascript
jquery文字填写自动高度的实现方法
Nov 07 Javascript
Linux系统中利用node.js提取Word(doc/docx)及PDF文本的内容
Jun 17 Javascript
浅析Angular 实现一个repeat指令的方法
Jul 21 Javascript
jquery实现用户打分评分特效
May 28 #Javascript
用Node.js通过sitemap.xml批量抓取美女图片
May 28 #Javascript
javascript转换静态图片,增加粒子动画效果
May 28 #Javascript
jQuery实现限制textarea文本框输入字符数量的方法
May 28 #Javascript
javascript实现行拖动的方法
May 27 #Javascript
JavaScript操作Cookie方法实例分析
May 27 #Javascript
JavaScript通过事件代理高亮显示表格行的方法
May 27 #Javascript
You might like
关于二级目录拖拽排序的实现(源码示例下载)
2013/04/26 PHP
yii2超好用的日期组件和时间组件
2016/05/05 PHP
PHP code 验证码生成类定义和简单使用示例
2020/05/27 PHP
用一段js程序来实现动画功能
2007/03/06 Javascript
JavaScript语法着色引擎(demo及打包文件下载)
2007/06/13 Javascript
JavaScript中switch判断容易犯错的一个细节
2014/08/27 Javascript
jQuery手机浏览器中拖拽动作的艰难性分析
2015/02/04 Javascript
基于JavaScript实现div层跟随滚动条滑动
2016/01/12 Javascript
javascript this详细介绍
2016/09/19 Javascript
Bootstrop实现多级下拉菜单功能
2016/11/24 Javascript
javascript垃圾收集机制的原理分析
2016/12/08 Javascript
JS字符串统计操作示例【遍历,截取,输出,计算】
2017/03/27 Javascript
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
2017/05/01 jQuery
AngularJS实现的JSONP跨域访问数据传输功能详解
2017/07/20 Javascript
angular1配合gulp和bower的使用教程
2018/01/19 Javascript
JavaScript函数节流和函数去抖知识点学习
2018/07/31 Javascript
详解angular2 控制视图的封装模式
2018/12/27 Javascript
重学JS 系列:聊聊继承(推荐)
2019/04/11 Javascript
vue+mock.js实现前后端分离
2019/07/24 Javascript
webpack HappyPack实战详解
2019/10/08 Javascript
jQuery实现全选、反选和不选功能的方法详解
2019/12/04 jQuery
JS实现页面侧边栏效果探究
2021/01/08 Javascript
Python的Bottle框架中实现最基本的get和post的方法的教程
2015/04/30 Python
不可错过的十本Python好书
2017/07/06 Python
Python中支持向量机SVM的使用方法详解
2017/12/26 Python
django启动uwsgi报错的解决方法
2018/04/08 Python
Python闭包函数定义与用法分析
2018/07/20 Python
用Python将mysql数据导出成json的方法
2018/08/21 Python
Python 实现还原已撤回的微信消息
2019/06/18 Python
pandas.DataFrame.drop_duplicates 用法介绍
2020/07/06 Python
Selenium 配置启动项参数的方法
2020/12/04 Python
HTML5+lufylegend实现游戏中的卷轴
2016/02/29 HTML / CSS
ONLY德国官方在线商店:购买时尚女装
2017/09/21 全球购物
描述内存分配方式以及它们的区别
2016/10/15 面试题
纪检干部对照检查材料
2014/08/22 职场文书
保护地球的宣传语
2015/07/13 职场文书