点击按钮在表格的某一行下,在添加一行(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拖拽界面:
随机推荐
- cogs 2057. [ZLXOI2015]殉国
2057. [ZLXOI2015]殉国 ★☆ 输入文件:BlackHawk.in 输出文件:BlackHawk.out 评测插件时间限制:0.05 s 内存限制:256 MB [题目描 ...
- 洛谷P1829 [国家集训队]Crash的数字表格 / JZPTAB(莫比乌斯反演)
传送门 式子好麻烦orz……大佬好腻害orz->这里 //minamoto #include<iostream> #include<cstdio> #define ll ...
- 剑指Offer的学习笔记(C#篇)-- 链表中倒数第K个点
题目描述 输入一个链表,输出该链表中倒数第k个结点. 一 . 数据结构基础概念普及(线性表). 线性表可分为顺序表与链表,它们是堆栈.队列.树.图等数据结构的实现基础. 顺序表,线性表的顺序存储结构是 ...
- JS中的MOD运算
最近研究汉诺塔非递归的时候,看到书上写了个MOD,久违啊,感觉好久没看到过了,都忘了怎么用了. 某人:我知道,这不就是取余嘛,直接%就行了. 嗯......,如果是python语言,你说的很对,但是我 ...
- 概念端类型“xxx”中的成员“ID”的类型“Edm.Decimal”与对象端类型“xxx”中的成员“ID”的类型“System.Int64”不匹配
概念端类型“xxx”中的成员“ID”的类型“Edm.Decimal”与对象端类型“xxx”中的成员“ID”的类型“System.Int64”不匹配 使用EF实体模型映射之后将edmx中xml映射关系中 ...
- Linux常用命令(补充)-grep
grep(global search regular expression(RE) and print out the line,全面搜索正则表达式并把行打印出来)是一种强大的文本搜索工具,它能使用正 ...
- CC01:确定字符互异
题目 请实现一个算法,确定一个字符串的所有字符是否全都不同.这里我们要求不允许使用额外的存储结构. 给定一个string iniString,请返回一个bool值,True代表所有字符全都不同,Fal ...
- C# dynamic与var的区别
1.C#编程总结(十四)dynamic 2.var和dynamic的区别及如何正确使用dynamic?
- ssrf漏洞分析
ssrf漏洞分析 关于ssrf 首先简单的说一下我理解的ssrf,大概就是服务器会响应用户的url请求,但是没有做好过滤和限制,导致可以攻击内网. ssrf常见漏洞代码 首先有三个常见的容易造成ssr ...
- 补充:jQuery的ajax
一.jQuery的ajax 什么是ajax AJAX = 异步的javascript和XML(Asynchronous Javascript and XML) 简言之,在不重载整个网页的情况下,AJA ...