html中删除表格的一行(有弹窗)
html中删除表格一行其实很简单,但是加上一个提示弹窗后,点击确定后却获取不到要删除的是哪一行,下面是一个demo



html:
<tr>
<td>
<input type="checkbox" class="checkBig" />
</td>
<td>安徽车乐优</td>
<td>13888888888</td>
<td>安徽省合肥市政务区金寨路与潜山路交口金潜广场</td>
<td>门店</td>
<td>
<div class="opo">
<div class="modify">修改</div>
<div class="delete" onclick="shanchu(this)">删除</div>
</div>
</td>
</tr>
弹窗:
<!--删除-->
<div class="delcon">
<div class="desure">确认删除?</div>
<div class="delfoot">
<div class="delcer">确认</div>
<div class="delcan">取消</div>
</div>
</div>
弹窗css:
.delcon{
width: 30%;
overflow: hidden;
background: #fff;
box-sizing: border-box;
border: 5px solid #3eb4c5;
position: fixed;
left: 33%;
top: 20%;
z-index: 999;
display: none;
}
.desure{
width: 100%;
height: 35px;
line-height: 35px;
text-align: center;
margin-top:45px;
margin-bottom: 30px;
}
.delfoot{
width: 100%;
height: 35px;
margin-bottom: 20px;
}
.delcer{
float: left;
margin-left: 20%;
width: 80px;
height: 35px;
line-height: 35px;
text-align: center;
color: #fff;
font-size: 12px;
font-weight: 700;
background: #3eb4c5;
cursor: pointer;
}
.delcan{
float: left;
margin-left: 15%;
width: 80px;
height: 35px;
line-height: 35px;
text-align: center;
color: #383838;
font-size: 12px;
/*font-weight: 700;*/
box-sizing: border-box;
border:1px solid #C3C3C3
/*background: #3eb4c5;*/;
cursor: pointer;
}
js;
//删除
function shanchu (obj){
$('.delcon').fadeIn()
// //确定
$('.delcer').click(function(event){
$(obj).parent().parent().parent().remove();
$('.delcon').fadeOut()
})
//取消
$('.delcan').click(function(event){
$('.delcon').fadeOut()
})
}
html中删除表格的一行(有弹窗)的更多相关文章
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- 利用jquery动态添加和删除表格的一行,并且保存单行数据
开发时遇到一个需求:要求要在页面的表格可以添加和删除一行,并能填写对应的数据后保存这一行数据. HTML代码 界面使用了freemarker框架,teams是后台传过来的list类型数据 <fo ...
- js实现在表格中删除和添加一行
<!DOCTYPE html><html> <head> <title> new document </title> <meta ht ...
- VBA删除表格最后一行
Sub 删除最后一行() If MsgBox("要为所有表格添加列吗?", vbYesNo + vbQuestion) = vbYes Then To ActiveDocument ...
- dtgrid 手动条件删除表格中的某一行
dtgrid 手动条件删除表格中的某一行 var grid = $.fn.DtGrid.init(dtGridOption); $(function () { grid.load(); }); fun ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(十一)--添加/删除表格中的记录
添加/删除表格中的记录 我们的最终功能是在表格中添加删除 我们通过单机工具栏上的按钮来实现添加删除 当我们单击添加按钮的时候, 表单中 第一行默认填写New contact 光标自动聚焦 当用户点击删 ...
- 在网页中动态地给表格添加一行内容--HTML+CSS+JavaScript
需求描述: 用户在页面上点击按钮,可以把文本框中的数据在表格的新的一行中显示,具体表现如下图: 如果如果输入框内容有一项为空,弹出对话框‘请将数据填入完全 步骤: 1.按钮注册单击事件 2.获取并判断 ...
- Java 获取、删除Word文本框中的表格
本文介绍如何来获取Word文本框中包含的表格,以及删除表格. 程序测试环境包括: IDEA JDK 1.8.0 Spire.Doc.jar 注:jar导入,可通过创建Maven程序项目,并在pom.x ...
- js动态向页面中添加表格
我们在实际开发中经常会想要实现如下情况: 点击某个按钮,然后动态的网页面里面添加一个表格或者一行,这个更加灵活方便.但是实现起来肯定不能像在页面里面直接写标签来的容易,以下是我项目中的代码,拿过来分享 ...
随机推荐
- <转>经典测试用例:电梯、杯子、桌子、洗衣机
1.测试项目:电梯 需求测试:查看电梯使用说明书.安全说明书等 界面测试:查看电梯外观 功能测试:测试电梯能否实现正常的上升和下降功能.电梯的按钮是否都可以用: 电梯门的打开,关闭是否正常:报警装置是 ...
- webdriervAPI(常用的js方法)
from selenium import webdriver driver = webdriver.Chorme() driver.get("http://www.baidu.co ...
- w 命令
NAME w - Show who is logged on and what they are doing. SYNOPSIS w - [husfiV] [user] 参数说明: -f 开启或关闭显 ...
- hadoop3.1.2队列
hapood3.1.2 capacity-scheduler.xml CDH6.2 在配置中输入fair,转成json格式看. yarn资源池配置: CDH--yarn--动态资源池配置 pool_d ...
- ABC130 Task F. Minimum Bounding Box
题目链接 题解 最小的 bounding box 一定可以在四个时间段的最左端点和最右端点之间取到. 举例言之,设四个时间段分别是 (2, 5), (7, 10), (4, 9), ( 10, 20) ...
- 如何用纯 CSS 创作六边形按钮特效
效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/xjoOeM 可交互视频教 ...
- 2.bash术语定义
2.术语定义POSIX:基于Unix的一系列操作系统可移植性的标准.Bash主要和POSIX标准第1003.1号中的<Shell和使用工具>有关.空白符:一个空格或者制表符.内部命令:在s ...
- session+验证码 学习
分析 LoginServlet类 @WebServlet("/loginServlet") public class LoginServlet extends HttpServle ...
- monkey 进阶使用手册,monkey随机测试后怎么定位问题
首先我们知道使用monkey后,我们可以查看三种类型的日志,一种是安卓内核日志,一种是安卓系统自己的日志,还有一种是monkey日志. 当我们使用monkey进行随机测试时,如何才知道我们这次随机测试 ...
- Python两个内置函数locals 和globals
这两个函数主要提供,基于字典的访问局部和全局变量的方式.在理解这两个函数时,首先来理解一下python中的名字空间概念.Python使用叫做名字空间的东西来记录变量的轨迹.名字空间只是一个字典,它的键 ...