点击按钮在表格的某一行下,在添加一行(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拖拽界面:
随机推荐
- php 连接 memcached 并调用
话不多说,上代码,自己看注释 <?php header("Content-type: text/html; charset=utf-8"); $mem = new Memca ...
- 汇总:unity中弹道计算和击中移动目标计算方法
http://download.jikexueyuan.com/detail/id/432.html 弹道计算是游戏里常见的问题,其中关于击中移动目标的自动计算提前量的话题,看似简单,其实还是挺复杂的 ...
- codevs 2314 数学作业
2314 数学作业 2011年省队选拔赛湖南 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 大师 Master 题目描述 Description 小 C 数学成绩优异 ...
- [Xcode 实际操作]五、使用表格-(8)自定义UITableView单元格Accessory样式(附件图标)
目录:[Swift]Xcode实际操作 本文将演示如何自定义单元格的附件图标. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit //首先添 ...
- css布局知识点汇总
昨天早上看到了一篇很棒的文章,这篇文章将布局的一些知识点整理的很不错.我也想整理一下,这样在以后的项目中可以活学活用,避免只用一种方式. 参考文章:https://segmentfault.com/a ...
- django后台管理系统(admin)的简单使用
目录 django后台管理系统的使用 检查配置文件 检查根urls.py文件 启动项目,浏览器输入ip端口/admin 如: 127.0.0.1/8000/admin 回车 注册后台管理系统超级管理 ...
- Oracle共享服务器的连接模式
一般Oracle数据库安装默认都是选择专用服务器模式的连接方式,但实际上Oracle也支持共享服务器的连接模式,不过这种在实际生产中见到的很少,我个人只在一些医院行业的客户生产环境中见到过这类配置. ...
- hdu2466-Shell Pyramid
先预处理一下层和行所对应的数,然后二分三个答案,注意细节 #include<cstdio> #define inf 0x3f3f3f3f ; typedef __int64 LL; u ...
- python大战机器学习——人工神经网络
人工神经网络是有一系列简单的单元相互紧密联系构成的,每个单元有一定数量的实数输入和唯一的实数输出.神经网络的一个重要的用途就是接受和处理传感器产生的复杂的输入并进行自适应性的学习,是一种模式匹配算法, ...
- System.Span, System.Memory,还有System.IO.Pipelines
System.Span, System.Memory,还有System.IO.Pipelines 使用高性能Pipelines构建.NET通讯程序 .NET Standard支持一组新的API,Sys ...