<script language="javascript">
var RowMax=1;
function Add() //添加控件
{
var nRow=document.all.Table1.rows.length; //获得当前TABLE的行数
var objTheRow=document.all.Table1.insertRow(nRow);//执行添加
var objRow1=objTheRow.insertCell(0);
var objRow2=objTheRow.insertCell(1);
var objRow3=objTheRow.insertCell(2);
var objRow4=objTheRow.insertCell(3);
var objRow5=objTheRow.insertCell(4);
objRow1.innerHTML="<input type='text' id='cell1"+nRow+"' name='cell1"+nRow+"' onkeyup=smanPromptList('cell1"+nRow+"') value='基金代码/名称' onfocus=sfFocus('cell1"+nRow+"','"+nRow+"') onblur=sfBlur('cell1"+nRow+"') style='HEIGHT: 22px' size='15' style='border-style: solid; border-width:1;color:#999999'><div id='smanDisp"+nRow+"' style='BORDER-RIGHT:#799bb6 1px solid; BORDER-TOP:#799bb6 1px solid; DISPLAY:none; FONT-SIZE:14px; BACKGROUND:#ebf2f7; BORDER-LEFT:#799bb6 1px solid; CURSOR:default; BORDER-BOTTOM:#799bb6 1px solid; POSITION:absolute' onbulr></div>";
objRow1.align="center";
objRow1.bgcolor="#fefee6";
objRow2.innerHTML="<INPUT type='text' id='cell2"+nRow+"' size='14' style='border-style: solid; border-width:1;COLOR: #999999'><span class='songhei12_'> 万元</span>";
objRow2.align="center";
objRow2.bgcolor="#fefee6";
objRow3.innerHTML="<INPUT type='text' id='cell3"+nRow+"' size='17' style='border-style: solid; border-width:1;' class='Wdate' onFocus='new WdatePicker(this,\"%Y年%M月%D日\",false)'>";
objRow3.align="center";
objRow3.bgcolor="#fefee6";
objRow4.innerHTML="<SELECT id='cell4"+nRow+"'><OPTION selected value='银行'>银行</OPTION><OPTION selected value='证券'>证券</OPTION></SELECT> <INPUT type='text' id='cell5"+nRow+"' size='17' style='border-style: solid; border-width:1;color:#999999' onfocus=\"if(this.value == '请填写具体的银行/证券'){this.value='';}\" onblur=\"if(this.value==''){this.value = '请填写具体的银行/证券';}\" value='请填写具体的银行/证券'>";
objRow4.align="center";
objRow4.bgcolor="#fefee6";
objRow5.innerHTML="<INPUT type='button' value='删除' onclick='return Delete();'>";
objRow5.align="center";
objRow5.bgcolor="#fefee6";
RowMax=RowMax+1;
}
function Delete() //删除控件
{
var currRowIndex=event.srcElement.parentNode.parentNode.rowIndex;//获取当前索引
document.all.Table1.deleteRow(currRowIndex);//执行删除
}
</script>
<table id="Table1" cellSpacing="0" cellPadding="0" width="100%" border="0" name="Table1">
<tr>
<td vAlign="middle" align="center" width="15%" bgColor="#fefee6" height="25"><uc1:TxtBox id="TxtBox1" runat="server" Num="0"></uc1:TxtBox></td>
<td vAlign="middle" align="center" width="15%" bgColor="#fefee6" height="25"><INPUT id="cell20" style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid;COLOR: #999999"
type="text" size="14"><span class='songhei12_'> 万元</span></td>
<td vAlign="middle" align="center" width="21%" bgColor="#fefee6" height="25"><INPUT class="Wdate" id="cell30" style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid"
onfocus="new WdatePicker(this,'%Y年%M月%D日',false)" type="text" size="17"></td>
<TD vAlign="middle" align="center" width="21%" bgColor="#fefee6"><SELECT id="cell40">
<OPTION value="银行">银行</OPTION>
<OPTION selected value="证券">证券</OPTION>
</SELECT> <INPUT id="cell50" style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; COLOR: #999999; BORDER-BOTTOM: 1px solid"
type="text" size="17" onFocus="if(this.value == '请填写具体的银行/证券'){this.value='';}" onBlur="if(this.value==''){this.value = '请填写具体的银行/证券';}"
value="请填写具体的银行/证券"></TD>
<td vAlign="middle" align="center" width="15%" bgColor="#fefee6"> <INPUT onClick="return Add();" type="button" value="添加"></td>
</tr>
</table>
分享到:
相关推荐
在IT行业中,JavaScript(简称JS)通常用于网页前端交互,但通过特定的库和API,我们也能使用JS来操作Microsoft Word文档,包括在Word中创建和编辑表格。本篇文章将详细探讨如何使用JS来实现这一功能,以及相关的...
js 表格编辑 插入行 删除行 编辑数据 将表格内容生产json格式
在JavaScript编程中,动态添加表格数据行是一种常见的需求,特别是在构建交互式的Web应用程序时。这个功能允许用户在不刷新整个页面的情况下添加新的记录,提高了用户体验。在这个例子中,我们将探讨如何利用...
**增加(Add)**: 在表格中添加新行,可以创建一个新的`<tr>`元素,并为其填充`<td>`元素,然后将其插入到表格的适当位置。例如,我们可以使用`insertBefore()`或`appendChild()`方法将新行添加到表格中。 ```...
为了提供更好的用户体验,可以采用JavaScript(js)来实现表格的无缝滚动效果,让表格像一个无边界的容器一样平滑滚动。这种效果在大数据量的展示或者长表格中尤其有用,它能让用户更容易地浏览和查找信息。 首先,...
这些函数通常会操作DOM(Document Object Model),即文档对象模型,通过查找特定的表格元素(如`document.all.t`),然后在其内部插入新的`<tr>`或`<td>`元素。 ### 删除行与单元格 与创建新元素相对应,删除表格...
经过研究,发布我的复杂表格、多维展示的成果,如图: 下面是源码(copy and paste,run 看效果): 访问链接: http://www.idosoft.com.cn/javatech/11.html
js 实现 用JavaScript隐藏或显示表格列! 值得下载看看!资源免费,大家分享!!
在IT行业中,JavaScript(简称JS)是一种广泛使用的前端编程语言,它不仅限于网页交互,还可以处理各种数据格式,包括创建和操作Excel文件。在标题"js转换图片到Excel里面"和描述中提到的任务,是利用JavaScript将...
表格样式js"涉及到两个关键知识点:金额格式化处理和表格样式的JavaScript实现。 首先,我们来看“处理金额js”。在前端开发中,用户交互的数据往往包括货币金额,而这些金额通常需要进行格式化以便于阅读。`money-...
在JavaScript(JS)编程中,动态管理HTML元素是常见的需求,特别是对于表格(Table)这样的数据展示组件。本文将深入探讨如何使用JavaScript动态地增加和删除表格行。 首先,我们来了解一下HTML表格的基本结构。一...
"js css精美表格"的主题涉及到了JavaScript和CSS技术在创建美观、交互性强的表格方面的应用。在这个主题下,我们可以深入探讨以下几个关键知识点: 1. CSS(层叠样式表):CSS是用于控制网页元素样式的重要工具。在...
1. **动态添加行**:在JavaScript中,可以通过DOM操作动态地创建新的表格行(`<tr>`元素)并插入到表格中。用户可以点击“添加行”按钮,触发一个JavaScript函数,该函数将生成新的行结构,填充默认数据,然后将其...
在前端开发中,JavaScript(JS)和CSS是创建交互式且视觉吸引人的网页元素不可或缺的工具,特别是对于呈现数据的表格。"js实现漂亮的table表格"这个主题涉及到使用JavaScript和CSS来增强HTML表格的功能和外观,使其...
本篇文章通过一个简单的实例,展示了如何使用JavaScript实现表格行上下移动的操作,涉及到了对页面元素节点及属性的操作技巧。 首先,我们来看一个简单的表格示例,它包含了几个表格行(`<tr>`)和单元格(`<td>`)...
标题“Js_CSS实现多色表格”表明我们即将探讨如何使用JavaScript和CSS技术来创建具有不同颜色样式的表格。在网页开发中,表格是组织数据的一种常见方式,而通过JavaScript和CSS,我们可以为表格添加交互性以及更丰富...
otreetable.js 原生JS树形表格,调用非常简单(只需一句代码即可调用),获取HTML中输出的表格数据重构表格,以树形方式显示,可展开/收缩,不破坏表格原有数据格式及内容,支持无限级,兼容所有浏览器。当前版本...
JavaScript 使用ActiveX实现在Excel文件中插入图片
【标题】"原生js在线编辑excel表格代码.zip"是一个包含使用纯JavaScript实现的在线Excel表格编辑功能的代码资源。这个代码库可能旨在提供一种无需依赖外部库(如jQuery)或者服务器端处理的方式,让用户在浏览器中...
例如,要添加新行,你可以创建一个新的`<tr>`元素,并通过`innerHTML`属性设置其内容,然后将其插入到表格的`<tbody>`元素中。以下是一个简单的例子: ```javascript var table = document.getElementById('...