关于jquery实现动态加入table tr的问题我也不多说了 上面代码非常多地方都有凝视的
关于返回的 编辑后的table 数据 我这里想说的是我直接把他保存成一个连接起来的字符串了 格式 str=XXX | XXX | XXX ,XXX | XXX | XXX ,XXX | XXX | XXX
你也能够保存成对象类型的 我是为了方便后台的操作才这样做的
话不多说直接代码：
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title> </title> <script src="jquery-1.8.2.min.js" type="text/javascript"></script> <script type="text/javascript" language="javascript"> var count=4;//行数ID后缀var delid="";//删除的IDvar addid="";//加入ID的前缀//var a= str.split(",");function addTr2(tab, row){var trHtml="<tr id='row"+count+"' align='center'><td width='20%'> <input id='allCkb"+count+"' name='person' value='"+count+"' type='checkbox'/></td><td width='30%'><input type='text' value='"+count+"' id='title"+count+"' name=''></td><td width='30%'><input type='text' id='name"+count+"' name=''></td><td width='30%'><input type='text' id='sex"+count+"' name=''></td></tr>";addTr(tab, row, trHtml);addid+=count+",";count++;}function addTr(tab, row, trHtml){//获取table最后一行 $("#tab tr:last")//获取table第一行 $("#tab tr").eq(0)//获取table倒数第二行 $("#tab tr").eq(-2)var $tr=$("#"+tab+" tr").eq(row);if($tr.size()==0){alert("指定的table id或行数不存在！");return;}$tr.after(trHtml);}//全选功能//name是你点击出发chexbox的name itemname 是你要操作cheeckbox的namefunction qcheckbox(name,itemname){if($("input[name='"+name+"']:checkbox").attr("checked"))$("input[name='"+itemname+"']:checkbox").attr("checked",true); else$("input[name='"+itemname+"']:checkbox").attr("checked",false); }//chname你选择的checbox的name function del(chname){var chobj= $("input[name='"+chname+"']:checkbox");chobj.each(function(){if($(this).attr("checked")){delid += $(this).val()+",";$(this).parent().parent().remove();}})}function tableinfo(){var delobj= delid.split(",");var addobj= addid.split(",");var str="";for(var i=1;i<=3;i++){var title=$('#title'+i).val();var name=$('#name'+i).val();var sex=$('#sex'+i).val();str+=title+"|"+name+"|"+sex+",";}for(var j=0;j<addobj.length-1;j++){var a=true;for(var k=0;k<delobj.length-1;k++){if(delobj[k]==addobj[j]){a=false;break;}}if(a){var title=$('#title'+addobj[j]).val();var name=$('#name'+addobj[j]).val();var sex=$('#sex'+addobj[j]).val();str+=title+"|"+name+"|"+sex+",";}}alert(str);}</script> </head> <body> <input type="button" value="Add" id="b1" οnclick="addTr2('tab', -3)"> <input type="button" value="Delete" οnclick="del('person');"> <input type="button" value="取值" οnclick="tableinfo()"> <table id="tab" cellspacing="3" cellpadding="3" border="1"> <tr align='center'> <td width='20%'> <input id="allCkb" οnclick="qcheckbox('qperson','person')" type="checkbox" name="qperson"/></td><td width='30%'> 职位</td> <td width='30%'> 名称</td><td width='30%'> 分数</td></tr><tr id="row1" align='center'><td width='20%'></td><td width='30%'>联系人<input type="hidden" id="title1" value="联系人"/></td><td width='30%'><input type="text" id="name1" name=""></td><td width='30%'><input type="text" id="sex1" name=""></td></tr><tr id="row2" align='center'><td width='20%'></td><td width='30%'>老板<input type="hidden" id="title2" value="老板"/></td><td width='30%'><input type="text" id="name2" name=""></td><td width='30%'><input type="text" id="sex2" name=""></td></tr><tr id="row3" align='center'><td width='20%'> </td><td width='30%'>哈哈 <input type="hidden" id="title3" value="哈哈"/></td><td width='30%'><input type="text" id="name3" name=""></td><td width='30%'><input type="text" id="sex3" name=""></td></tr><tr align="center"><td width="30%" colspan="2">分数合计</td><td width="30%" colspan="2">80</td> </tr><tr align="center"><td width="30%" colspan="2">人员合计</td><td width="30%" colspan="2">80</td> </tr></table> </body> </html>
注意要把jquery的js引用了 我这里的jquer的JS是和网页放在同一级文件夹下的
