jquery关于动态添加行的有关问题!
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局部代码没有贴出来,大致过程如下:
点击事件绑定方法,方法内对拼一个<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你自己转换下吧。
------解决方案--------------------
------解决方案--------------------
设置一个删除的按钮不就行了?
------解决方案--------------------
简单例子
- HTML code
<div id="div1"></div> <a href="javascript:void(0)" onClick="append()">添加</a>