社区
JavaScript
帖子详情
如何用js添加一个tr,tr中有多个td?
nevil
2005-04-19 02:01:19
如标题所问.
...全文
1210
9
打赏
收藏
如何用js添加一个tr,tr中有多个td?
如标题所问.
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
9 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
fantiny
2005-04-19
打赏
举报
回复
上面的那些javascript里面的各个设置td的innerHTML属性的代码里,按照你自己的要求来添加或者修改其他表单都可以的。
qiqunet
2005-04-19
打赏
举报
回复
有什么麻烦?用innerHTML加就是·#¥
qiqunet
2005-04-19
打赏
举报
回复
<table id="table1"><tr><td></td><td></td><td></td></tr></table>
<script>
function AddNew(){
var newRow;
var newCell;
newRow = table1.insertRow();
newCell=newRow.insertCell();
newCell.width="164";
newCell=newRow.insertCell();
newCell.innerHTML="<select><option value='0'>0</option></select>"
newCell.width="164";
newCell=newRow.insertCell();
newCell.innerHTML="<select><option value='1'>1</option></select>"
newCell.width="164";
}
AddNew();
<script>
nevil
2005-04-19
打赏
举报
回复
要是<TD>中还有个<SELECT>哩?
有点麻烦.
qiqunet
2005-04-19
打赏
举报
回复
<table id="table1"><tr><td></td><td></td><td></td></tr></table>
<script>
function AddNew(){
var newRow;
var newCell;
newRow = table1.insertRow();
newCell=newRow.insertCell();
newCell.width="164";
newCell=newRow.insertCell();
newCell.width="164";
newCell=newRow.insertCell();
newCell.width="164";
}
AddNew();
<script>
jianzong2000
2005-04-19
打赏
举报
回复
<BODY>
<SCRIPT LANGUAGE="JavaScript">
function addRow(tbl)
{
var a = tbl.insertRow();
a.id = "a" + tbl.rows.length;
for(var i=0; i<tbl.rows[0].cells.length; i++)
{
var tc = a.insertCell();
tc.innerText = " ";
tc.onfocus = function()
{
this.parentElement.parentElement.parentElement.ct = this.parentElement;
this.innerHTML = "<input type=\"text\" value=\"" + (this.innerText==" "?"":this.innerText) + "\" style=\"width:100%;height:100%;border:0;\" onblur=\"this.parentElement.innerText=(this.value==''?' ':this.value);\">";
this.children[0].focus();
};
}
}
function delRow(tbl)
{
if(!tbl.ct) return;
tbl.deleteRow(tbl.ct.rowIndex);
tbl.ct = null;
}
</SCRIPT>
<table border=1 id="tbl">
<tr id=a1>
<td>123</td>
<td>456</td>
</tr>
</table>
<input type="button" value="添加行" onclick="addRow(document.all.tbl);">
<input type="button" value="删除行" onclick="delRow(document.all.tbl);">
</BODY>
梅雪香
2005-04-19
打赏
举报
回复
<html>
<head>
<title>code by meixx</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="javascript">
var curRow=null;
function selectRow(tr1){
if(curRow)
curRow.bgColor="#FFFFFF";
tr1.bgColor="e7e7e7";
curRow=tr1;
}
function addRow(src){
var newrow = src.insertRow(src.rows.length-1);
newrow.attachEvent("onclick",function(){selectRow(newrow);});
newrow.height=20;
var i=4;
while(i--){
var newcell = newrow.insertCell();
switch(i){
case 0: newcell.innerHTML= '<input type="button" onClick="javascript:delRow(this.parentElement.parentElement)" value="删除此行">';break;
default: newcell.innerHTML=div1.innerHTML;break;
}
}
}
function delRow(src){
src.parentElement.deleteRow(src.rowIndex);
}
</script>
</head>
<body>
<table id="tb" width="100%" border="1" align="center" cellpadding="1" cellspacing="1" style="border-collapse:collapse" bordercolor="#111111">
<tr>
<th scope="col" width="25%">一</th>
<th scope="col" width="25%">二</th>
<th scope="col" width="25%">三</th>
<th scope="col" width="25%">四</th>
</tr>
<tr id="blankRow" onClick="addRow(this.parentElement)">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<div id="div1" style="display:none "><input id="txt" type="text" style="width:97%; background-color:#FFFFEF"></div>
</body>
</html>
qiqunet
2005-04-19
打赏
举报
回复
function AddNew(){
var newRow;
var newCell;
newRow = table1.insertRow();
newCell=newRow.insertCell();
newCell.width="164";
newCell=newRow.insertCell();
newCell.width="164";
newCell=newRow.insertCell();
newCell.width="164";
}
myvicy
2005-04-19
打赏
举报
回复
<html>
<head></head>
<script language="javascript">
function add()
{
var myTable = document.getElementById("aa");
var newRow = aa.insertRow(aa.rows.length);
var newTd1 = newRow.insertCell(0);
newTd1.innerText="lala";
var newTd2 = newRow.insertCell(1);
newTd2.innerText="^_^";
}
</script>
<body>
<form>
<input type="button" onclick="addline()" value="增加一行">
<table border="1" id="test">
<tr>
<td colspan="2"><input type="text" name="tt[]"></td>
</tr>
</table>
<input type="submit">
</form>
<script>
function addline(content){
newline=document.all.test.insertRow();
newline.insertCell().innerHTML='<input type="text" name="tt[]"><input type="button" value="删除此行" onclick="del()">'
}
function del(){
document.all.test.deleteRow(window.event.srcElement.parentElement.parentElement.rowIndex);
}
</script>
<input type="button" value="点我啊" onclick="add();">
<table id="aa" border="1" bordercolor="black" style="border-collapse: collapse" width="80%">
<tr>
<td width="50%">xixi</td>
<td width="50%">haha</td>
</tr>
</table>
</body>
</html>
动态
添加
td
tr
表格 javascript
在JavaScript编程中,动态
添加
`
td
`(表格数据单元格)和`
tr
`(表格行)是常见的需求,尤其在创建交互式网页时。本文将深入探讨如何利用JavaScript实现这一功能,以及它在实际开发中的应用。 首先,我们需要了解HTML...
jQuery移除
tr
无效的解决方法(
tr
是动态
添加
)
在本例中,`temp`是
一个
`<a>`元素,它的父元素是`<
td
>`,`<
td
>`的父元素是需要删除的`<
tr
>`。因此,可以这样写: ```javascript $(temp).parent().parent().remove(); ``` 这段代码首先选取`temp`所代表的`<a>`...
js
动态生成table
在JavaScript中,动态生成table是一种常见的网页交互功能,它允许我们根据需求在页面上实时创建、
添加
或删除表格行(
tr
)和单元格(
td
)。这个功能在数据展示、表格编辑或者用户交互丰富的应用场景中非常实用。下面...
JavaScript中使用正则匹配多条,且获取每条中的分组数据
不过我要面对的是
一个
很松散的HTML页面,无法XML 因此,本文的重点在于如果要获取的网页
中有
Table或List段落,需要将这些段落的信息按照列的方式保存到
JS
的数组中 直接贴代码: 代码如下: var s
tr
= “字符串字符串...
简单的
js
表格操作
点击
一个
添加
按钮,就会在表格的末尾动态地插入
一个
新的行(`
tr
`),并且该行会包含两个数据单元格(`
td
`)以及
一个
删除按钮。当用户点击删除按钮时,当前行将被移除。 具体实现步骤如下: 1. 定义
一个
变量`num`,...
JavaScript
87,993
社区成员
224,694
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章