`
lzkyo
  • 浏览: 457239 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

javascript 动态添加删除控件

    博客分类:
  • Web
阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>
<script language="javascript">
var i = 0,j = 0;     //行号与列号
var oNewRow  ;    //定义插入行对象
var oNewCell1,oNewCell2;     //定义插入列对象

//添加条件行
function AddRow()
{
i = document.all.MyTable.rows.length;
oNewRow = document.all.MyTable.insertRow(i);
oNewRow.id = j;

//添加第一列
oNewCell1 = document.all.MyTable.rows[i].insertCell(0)
oNewCell1.innerHTML = "<input type='text' id='Value" + j + "'"+" size='14' value=\"\">";

//添加第二列
oNewCell2 = document.all.MyTable.rows[i].insertCell(1)
oNewCell2.innerHTML ="<input type=button name=Del" + j + " value='删除当前行'"+"onClick='DelCurrentRow(" + j + ");'>";
j++;
}

//删除行
function DelCurrentRow(j)
{
with(document.all.MyTable)
{
for (var i=0;i<rows.length;i++)
{
if (rows[i].id == j)
{
deleteRow(i);
}
}
}
}
</script>

<form method="post" action="">
<div style="margin-left:80px;color:red;font-weight:bold;"></div>
<div align="center" class="title-font">
动态添加HTML元素
</div>
<br>
<table style="border:0px;" cellpadding=0 cellspacing=0
     align="center">
<tr>
<td style="border:0px;" width="340"><hr></td>
<td style="border:0px;"><input type=button value="添加" name"addFieldBT" onclick="AddRow();"/></td>
</tr>
</table>
<br><br>
<table style="border:0px;" cellpadding=0 cellspacing=0
   align="center" class="TableBody" id="MyTable" border="0">
</table>
<br><br>
<table style="border:0px;" cellpadding=0 cellspacing=0
   align="center">
  <tr>
   <td align="center" style="border:0px;">
   <input type=button value="提交" name="searchBT" onclick=""/>
   </td>
  </tr>
</table>
<script language="javascript">AddRow()</script>
</form>
</BODY>
</HTML>

 

分享到:
评论

相关推荐

    javascript树型控件,绝对好用!

    支持动态的添加节点、删除节点、自定义节点图标等。功能使用绝对方便! 此次上传是经过修改的版本,在节点数目较多的情况下,比如500个以上,大大加快了加载速度。以及修正了在节点不连续增加的情况下有可能出现事件...

    添加和删除控件1

    特别是,添加代表每个控件的按钮列表:复制接下来,我们创建一个自定义JavaScript文件,首先创建一个包含所有OpenLayers控件的数组:复制new ol

    动态添加和删除用户控件

    在页面上动态添加和删除用户控件,并保持控件状态。

    异步表格控件源码下载

    提供了若干易用的客户端方法,让你的程序在添加、修改、删除表格数据时无需重新加载大量的表格数据,而仅需要更新客户端展现结果,这样使得程序的后台访问次数大大降低。采用了类似AjaxPro的异步回调方式,使得您...

    ASP.NET中 PlaceHolder 控件的使用方法

    使用 PlaceHolder 控件可以将空容器控件放到网页中,然后在运行时动态添加、删除或遍历各子元素。该控件只呈现其子元素;它本身并没有基于 HTML 的输出。 在实际使用过程中可以向PlaceHolder添加任何Html控件,甚至...

    ASP.NET 控件的使用

    3.1.1 验证控件与JavaScript 85 3.1.2 使用Page.IsValid 85 3.1.3 设置Display属性 86 3.1.4 突出显示验证错误 86 3.1.5 使用验证组 90 3.1.6 禁用验证 93 3.2 使用RequiredFieldValidator控件 94 3.3 使用...

    程序天下:JavaScript实例自学手册

    1.20 在网页中动态添加Script脚本 1.21 用JavaScript随机修改页面的标题 1.22 判断网页加载完毕 1.23 嵌入网页的播放器 1.24 设置指定网页为主页 1.25 使用JavaScript传递页面参数 1.26 页面被冻结 第 2章 按钮特效 ...

    JavaScript

    这是一个javascript写的;控件,当鼠标单击一次“添加”就自动增加,单击“删除”的时候就删除;

    《程序天下:JavaScript实例自学手册》光盘源码

    1.20 在网页中动态添加Script脚本 1.21 用JavaScript随机修改页面的标题 1.22 判断网页加载完毕 1.23 嵌入网页的播放器 1.24 设置指定网页为主页 1.25 使用JavaScript传递页面参数 1.26 页面被冻结 第 2章 按钮特效 ...

    JavaScript详解(第2版)

    第1章 JavaScript简介 1 1.1 JavaScript是什么 1 1.2 JavaScript不是什么 2 1.3 JavaScript的用处 3 1.4 JavaScript及其在Web页面中的位置 3 1.5 Ajax是什么 5 1.6 JavaScript是什么样子的 6 1.7 ...

    用js写的树型控件,非常好用哦

    自己写的一个树型控件,很好用哦。 支持动态的添加节点、删除节点、自定义节点图标等。 功能使用绝对方便!

    ASP.NET基础控件-教程

    内容:  Asp.net页面内传参数方法  调用存储过程(两种方法比较) ... Asp.net中DataList控件添加删除  Asp.net获取请求的用户信息IP地址  获取世界IP地址库显所在城市信息  MySQL事务处理  SQL内部常用函数

    .net50个常用方法简单华丽的分页控件功能大的分页控件 50个实用方法

    添加的时候 一定要引用 不要直接复制DLL 不然没有方法注释 最强大分分页控件 华丽的分页控件 实用的分页控件 有最新最实用的方法 联系小柒 下面是 AspNetHelp 类 方法概述 ///Show()弹出对话框 ///...

    思特Web树型控件1.0<思特作品>

    3、可动态增加或删除树节点,方便其它语言中AJAX动态加载。 4、兼容IE各版本、FireFox、谷歌、Safari、Opera等主流浏览器。 5、支持同一页显示多个树(定义不同的变量即可)。 6、可设置以下的属性config. ...

    JavaScript完全自学宝典 源代码

    示例描述:介绍JavaScript与表单控件。 6.1.html JavaScript获取文本框的值。 6.2.html JavaScript控制文本框。 6.3.html 文本框的JavaScript特效。 6.4.html 获取select元素的值。 6.5....

    Calendar:JavaScript实现的可以查看、添加、删除待办事项的日历控件

    CalendarJavaScript实现的日历控件,包括显示日历、显示待办事项的月统计数、当前日统计数、选中日期的待办事项列表展示、待办事项添加、删除等功能。2015年3月21号更新

    思特Web树型控件1.0(纯js版:<思特作品>)

    3、可动态增加或删除树节点,方便其它语言中AJAX动态加载。 4、兼容IE各版本、FireFox、谷歌、Safari、Opera等主流浏览器。 5、支持同一页显示多个树(定义不同的变量即可)。 6、无限级. 7、可设置以下的属性...

    javascript代码常用大全

    2.2 动态添加,修改,删除下拉框中的元素 2.3 可以输入内容的下拉框 2.4 多行文本框中只能输入iMax文字。如果多输入了,自动减少到iMax个文字(多用于短信发送) 3、打印类 3.1 打印控件 4、事件类 4.1 ...

    javascript 常用代码大全

    2.2 动态添加,修改,删除下拉框中的元素 2.3 可以输入内容的下拉框 2.4 多行文本框中只能输入imax文字。如果多输入了,自动减少到imax个文字(多用于短信发送) 3、打印类 3.1 打印控件 4、事件类 4.1 ...

Global site tag (gtag.js) - Google Analytics