某些时候我们需要将我们输入的信息录入到表格中,并且点击行尾的删除按钮可以删除当前行,下面的代码可以简单实现这个功能。(又是取名荒的一天......)
姓名<input type="text" id="ipt1" />
性别<input type="text" id="ipt2" />
<input type="button" value="提交" id="tj" />
<table id="table">
</table>
</body>
<script>
var oUser = document.getElementById('ipt1');
var oSex = document.getElementById('ipt2');
var btn = document.getElementById('tj');
btn.onclick = function(){
var oTable = document.getElementById('table');
var oTr = document.createElement('tr');
var oTd1 = document.createElement('td');
var oTd2 = document.createElement('td');
var oTd3 = document.createElement('td');
var btn1 = document.createElement('button');
btn1.innerHTML = '删除';
btn1.setAttribute('onclick','del(this)');
oTd1.innerHTML = oUser.value;
oTd2.innerHTML = oSex.value;
oTd1.setAttribute('aaa','val');
oTr.appendChild(oTd1);
oTr.appendChild(oTd2);
oTd3.appendChild(btn1);
oTr.appendChild(oTd3);
oTable.appendChild(oTr);
//删除某一行
function del(obj){
var oParent = obj.parentNode.parentNode;
// console.log(oParent)
document.getElementById('table').removeChild(oParent);
</script>
某些时候我们需要将我们输入的信息录入到表格中,并且点击行尾的删除按钮可以删除当前行,下面的代码可以简单实现这个功能。(又是取名荒的一天......)&lt;body&gt; 姓名&lt;input type="text" id="ipt1" /&gt; 性别&lt;input type="text" id="ipt2" /&gt; &lt;i
使用
js
实现多选
删除
谈谈多选
删除
在我们实际生活中多选
删除
处处都有,比如在购物网站上已经加入购物车的商品,准备结算的时候发现有一部分的商品用不上,于是就把它们从购物车里移出,但是在移出之前要把要移出的商品前面的勾打上,然后再
点击
移出购物车才能把这些商品移除,接下来我就利用H5的checkbox和button标签再配合
js
来给大家演示下这个操作。
首先我们来看页面代码:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
<title>
添加
删除
记录练习</title>
<link rel="stylesheet" type="text/css" href="css/delete.css"/>
采用node.removeChild(child)进
行
节点的
删除
操作,需要注意的是
删除表
格所在
行
,需
删除
所在
行
的tbody。采用创建document.createElement('tagname')和
添加
节点node.appendChild(child)将学生数据录入
表格
.代码如下:
<!DOCTYPE html>
<html lang="zh-CN">
<meta charset="UTF-8">
<meta name
点击
超链接,弹出一个询问是否
删除
的对话框,如果
点击
了确定,
删除
此学生的信息。
1. 超链接执
行
一个
js
方法
<a href="#" onclick="doDelete(${stu.sid})">
删除
</a>
在doDelete()方法里判断
点击
的选项,然后跳转到DeleteServlet。
<scrip...