点击按钮在表格的某一行下,在添加一行(HTML+JS)
使用js在指定的tr下添加一个新的一行newTr
html代码:
<table>
<tr>
<td>用户名:</td>
<td><input type="text" name="username"></td>
</tr>
<tr>
<td>密码:</td>
<td><input type="text" name="password"></td>
</tr>
<tr>
<td colspan=2>
<input type="button" name="add" value="在密码行后添加一行" onclick="addTr()">
</td>
</tr>
</table>
javascript代码:
<script>
function addTr(){
var tb=document.getElementById("table1");
var newTr=tb.insertRow(2);//表示在第二行后添加一行
var newTd=newTr.insertCell();//表示在添加的行上添加第一格
newTd.innerHTML="邮箱:";
var newTd2=newTr.insertCell();//表示在添加的行上添加第二格
newTd.innerHTML="<input type='text' name='email' />";
}
</script>
点击按钮在表格的某一行下,在添加一行(HTML+JS)的更多相关文章
- JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里
JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里 <!doctype html> <html manifest="lab4.manifest&q ...
- [原]点击按钮,表格隔行变色:偶数行为黄色背景,奇数行为默认颜色。通过table的getElementsByTagName取得所有的tr,依次遍历,如果是偶数就…………。
window.onload = function () { document.getElementById('btn').onclick = function () { ...
- DataGridView添加一行数据、全选、取消全选、清空数据、删除选中行
.net 2005下的Windows Form Application,一个DataGridView控件和4个Button,界面设置如下: 代码如下,有注解,相信大家都看得明白: ...
- element+vue点击新增表格内在已有数据添加一行带输入框内容
在element+vue项目中,需求要表格内已有数据,点击新增在首行添加一行带输入框内容 table的数据为datas=[],那么下面是一列的数据,多列可循环或复制 <el-table-colu ...
- 【HTML5】页面点击按钮添加一行 删除一行 全选 反选 全不选
页面点击按钮添加一行 删除一行 全选 反选 全不选 页面效果图如下 html页面代码 <!DOCTYPE html> <html> <head> & ...
- 点击按钮添加一行,和本行的删除功能,序号变动,name属性更改
<!--html结构--> <div> <input type="button" value="添加一行" onclick=&qu ...
- js实现在表格中删除和添加一行
<!DOCTYPE html><html> <head> <title> new document </title> <meta ht ...
- 在网页中动态地给表格添加一行内容--HTML+CSS+JavaScript
需求描述: 用户在页面上点击按钮,可以把文本框中的数据在表格的新的一行中显示,具体表现如下图: 如果如果输入框内容有一项为空,弹出对话框‘请将数据填入完全 步骤: 1.按钮注册单击事件 2.获取并判断 ...
- Py3+PyQt5+Eric6:学习记录之第一天:点击按钮获取文本框的值并输出。
一.使用qt designer拖拽界面. 使用qtdesigner拖拽界面:
随机推荐
- org.apache.commons.httpclient和org.apache.http.client区别(转)
官网说明: http://hc.apache.org/httpclient-3.x/ Commons HttpClient项目现已结束,不再开发.它已被其HttpClient和HttpCore模块中的 ...
- Unity surface shader 2
UV滚动 Shader "Nafio/ScrollUV" { Properties { _Tex("T",2D) = "white" {} ...
- 2014-10-5 NOIP模拟赛
祖孙询问 (tree.pas/c/cpp) [问题描述] 已知一棵n个节点的有根树.有m个询问.每个询问给出了一对节点的编号x和y,询问x与y的祖孙关系. [输入格式] 输入第一行包括一个整数n表示节 ...
- js函数—隐形参数this
前言 this是函数中的隐形参数,它绑定的值取决于函数的调用位置. this的定义 <你不知道的js>中是这样说的:是函数体内的隐式参数,this就是记录函数调用上下文的一个属性.可以在函 ...
- hdu1494 跑跑卡丁车(动态规划)
Description 跑跑卡丁车是时下一款流行的网络休闲游戏,你可以在这虚拟的世界里体验驾驶的乐趣.这款游戏的特别之处是你可以通过漂移来获得一种 加速卡,用这种加速卡可以在有限的时间里提高你的速度. ...
- .net core实现的全程序跟踪
Ocelot中使用Butterfly实践 ocelot Ocelot + Consul实践 Ocelot中使用Butterfly实践 Ocelot监控 Ocelot统一权限验证 ...
- docker 的目录问题
今天在使用Dockerfile制作镜像的时候,使用命令 :COPY aaa.sql /usr/test 下时, 总是报错 “INFO[0001] stat /var/lib/docker/aufs/m ...
- CS round--36
https://csacademy.com/contest/round-36/summary/ C题是一个贪心,最坏情况是,一开始肯定是每一对袜子都抽一个,然后就需要N个袜子了.后面的情况就是相同的了 ...
- (转) RHEL7 忘记密码修改root密码
博客链接:http://blog.csdn.net/derkampf/article/details/54346516 RHEL7进入单用户方式和重置密码方式发生了较大变化,GRUB由b引导变成了ct ...
- this、apply、call的指向
1.关于this this它总是返回一个对象,是指调用当前函数的对象,由于对象的属性可以赋给另一个对象,所以属性所在的当前对象是可变的,即this的指向是可变的. var person={ name: ...