mootools1.2 动态给table 添加删除行tr
?
页面内容
<table id="tablePersonNum"> <thead> <tr> <th style="height: 14px"><div align="center">姓名</div></th> <th style="height: 14px"><div align="center">证件</div></th> <th style="height: 14px"><div align="center">地址</div></th> <th value="测试" id="btnTable" onclick="createTable();"/>?
?
js脚本 mootools 1.2
//添加tr 函数function createTable() { //定义显示要的信息 var str = "<input ReadOnly='true' class='edit' type='text' id='txtName' />"; var str1 = "<input ReadOnly='true' class='edit' type='text' id='txtIdentityID' />"; var str2 = "<input ReadOnly='true' class='edit' type='text' id='txtphone' />"; var add = "<input type='button' id='btnAddBody' class='cs-btnButton' value='添加' onclick='createTable();' />" var del = "<input type='button' id='btnDelBody' class='cs-btnButton' value='删除' onclick='delTable(this);' />" //获取table的tbody 注意 要用tbody var table = $('tbodyPersonNum'); var tr = new Element('tr', { 'id': "tr1" }); //注入到tr中 默认是放到最后 var td = new Element('td', { 'html': str }).inject(tr); var td1 = new Element('td', { 'html': str1 }).inject(tr); var td2 = new Element('td', { 'html': str2 }).inject(tr); var td3 = new Element('td', { 'html': add +""+ del }).inject(tr); //tr 添加到tbody 中 tr.inject(table); }//删除tr 函数 function delTable(obj) { //从dom中删除元素 $(obj.parentNode.parentNode).destroy(); }? 这样就完成了? 动态添加? 删除table中行操作