jQuery添加新内容有以下4个方法:
-
append()-在被选元素的结尾插入内容
-
prepend()-在被选元素的插入内容
-
after()-在被选元素之后插入内容
-
before()-在被选元素之前插入内容
下面实例演示:点击按钮则在表格数据区增加一行
1、HTML结构
<table id="test">
<thead>
<tr><th>列1</th><th>列2</th><th>列3</th></tr>
</thead>
<tbody>
<tr><td>1</td><td>1</td><td>2</td></tr>
<tr><td>2</td><td>4</td><td>5</td></tr>
</tbody>
</table>
<input type="button" id="btn1" value="在开头增加">
<input type="butttom" id="btn2" value="在末尾增加">
2、jQuery代码
$(function(){
$("#btn1").click(function(){
$("#test tbody").prepend('<tr><td></td><td></td><td></td></tr>');
$("#btn22").click(function(){
$("#test tbody").append('<tr><td></td><td></td><td></td></tr>');
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; chars
先在页面写一个隐藏的 然后当触发某一按钮时在响应事件中
clone()(克隆一个隐藏的),然后将克隆得到对象.show()显示出来再去掉对象的id或class(避免下次克隆 不是之前那个隐藏的)然后向对象中添加相应的数据,最后append(对象)将对象添加进表格。
js代码:
var lastRow = $("#hidden").clone(true);
lastRow.show(
(2)每天tr和td都有下标,且下标要动态变化,
(3)tr和td为什么下标不能随便写,原因是此处需要把所有tr中的数据以list的形式发送到后台对象中,所有每天tr中的tr中name=‘对象[index].属性’,必须有下标且下标要从0开始且要连续不能跳跃
(4)增加tr和td需要学习细节有:
创建td var $tdName = ...