日期:2014-05-16  浏览次数:20460 次

jquery关于动态添加行的问题!请教高手!

可以添加行,和删除行!并且行里的控件ID值,也不同!我能通过表单提交的方式把值,传入后台!
请教高手!

------解决方案--------------------
html局部代码没有贴出来,大致过程如下:
点击事件绑定方法,方法内对拼一个<tr>标签出来,需要生成的控件像<input>等的id,由原本最后的一行内取,然后<tr>添加到<table>
------解决方案--------------------
表格HTML编码贴出来
------解决方案--------------------
<?php header('Content-Type: text/html; charset=utf-8');?>
<script language="javascript" >
function rowsAdd()
{
var TableID = document.getElementById("TableID");

var newTr = TableID.insertRow(-1);
//设置行的样式
newTr.align='center';

//添加7列 
var newTd0 = newTr.insertCell(-1); 
var newTd1 = newTr.insertCell(-1);
var newTd2 = newTr.insertCell(-1);
var newTd3 = newTr.insertCell(-1);
var newTd4 = newTr.insertCell(-1);
var newTd5 = newTr.insertCell(-1);
var newTd6 = newTr.insertCell(-1);
 
//设置列内容和属性 
var createinput1=document.createElement("input");
var createinput2=document.createElement("select");
var createinput3=document.createElement("input");
var createinput4=document.createElement("input");
var createinput5=document.createElement("input");
var createinput6=document.createElement("input"); 

createinput1.type='text';
createinput1.id='';
createinput1.name='';

newTd0.innerHTML = "ID"; 
newTd1.appendChild(createinput1);
newTd2.appendChild(createinput2);
newTd3.appendChild(createinput3);
newTd4.appendChild(createinput4);
newTd5.appendChild(createinput5);
newTd6.appendChild(createinput6);

createinput2.options.add(new Option("男","0"));
createinput2.options.add(new Option("女","1"));
}
</script>

<input type="button" onclick="rowsAdd();" value="添加"/>

<table cellpadding="5" width="90%" align="center" border="1" id="TableID">
<tr align="center">
<td>ID</td>
<td ><input type='text' name='' id=''></td>
<td><select name='' id=''><option>男</option></select></td>
<td><input type='text' name='' id=''></td>
<td><input type='text' name='' id=''></td>
<td><input type='text' name='' id=''></td>
<td><input type='text' name='' id=''></td>
</tr>
</table>

=================================
javascritp的,jquery你自己转换下吧。

------解决方案--------------------
探讨
楼上的,我加的时候还是看不到控件属性ID啊~还有,加了后,怎么去减掉,取消!求教高手

------解决方案--------------------
设置一个删除的按钮不就行了?
------解决方案--------------------
简单例子
HTML code

<div id="div1"></div>
        <a href="javascript:void(0)" onClick="append()">添加</a>