<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title>表格添加行列</title>
</head> <body>
<table>
<tbody id="test"> </tbody>
</table> <table style="display: none;">
<tbody id="modo">
<tr> </tr>
</tbody>
</table> <button id="add_row">添加行</button>
<button id="add_col">添加列</button>
<button id="get_str">提取str</button>
<input type="text" id="dele_row_text" /><button id="dele_row">删除行</button>
<input type="text" id="dele_col_text" /><button id="dele_col">删除列</button> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
//var a = $("#test").children().length;
//alert(a)
$("#add_row").click(add_row)
$("#add_col").click(add_col)
$("#get_str").click(get_str)
$("#dele_row").click(dele_row)
$("#dele_col").click(dele_col) /* test1() function test1(){
var str = "1,2,3,4,5|7,8,9,10,11|12,13,14,15,16";
var a = str.split('|');
alert(a.length);
var b = a[1].split(',');
alert(b.length);
}*/ function add_row() { //添加行方法
var mode_tr = $("#modo tr:first").clone(); $("#test").append(mode_tr); f5_click()
} function add_col() { //添加列方法
var tr = $("tr"); //所有tr元素
$("tr").each(function(index) {
var td = $("<td>updata</td>").addClass("td_up");
//td.click(up)
$(this).append(td)
}) f5_click()
} function get_str() { //提取内容
var str="";
var trLen = $("#test tr").length;
for(var i = 0;i<trLen;i++){
var tr = $("#test").find("tr").eq(i);//获取每一行tr
var tdLen = $(tr).find("td").length;
for(var j = 0;j<tdLen;j++){
td=$(tr).find("td").eq(j);//获取每行td
str = str+$(td).text()+","
}
str = str+"|"//换行
}
return str;
} function dele_row() {
var row = $("#dele_row_text").val();
row = row - 1;
var tr = $("#test tr:eq(" + row + ")"); if(!confirm("确定要删除" + $(tr).find("td").eq(0).text() + "这一行？")) {
return false
} $(tr).remove();
} function dele_col() {
var col = $("#dele_col_text").val();
col = col - 1;
var tr = $("tr");
$.each(tr, function(index) {
if(index == 0) {
if(confirm("确定要删除" + $(this).find("td").eq(col).text() + "这一列？") == 0) {
return false;
}
}
$(this).find("td").eq(col).remove()
}); } function f5_click() {
$(".td_up").bind('click', function() {
$(this).text("aaa")
})
}
</script>
</body> </html>