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动态向页面中添加表格
我们在实际开发中经常会想要实现如下情况: 点击某个按钮,然后动态的网页面里面添加一个表格或者一行,这个更加灵活方便.但是实现起来肯定不能像在页面里面直接写标签来的容易,以下是我项目中的代码,拿过来分享 ...
随机推荐
- Java Applet基础——输出HelloWorld
前言: 我自己不专用applet,仅仅是了解一下,如果有不对的地方,还望大家多多帮助~谢谢! 一. 准备环境 1. 安装Java的编译环境(另行百度哦~) 2. 下载 applet.jar ,放在项目 ...
- jmeter设置中文语言
1.在jmeter的bin目录下找到 jmeter.properties 文件并打开 2.搜索关键字 “language”,将37行(以搜索到的位置为准)改成下图所示:language=zh_CN ...
- Android开发 发布相关知识
1 三种BuildSystem简介 注意:ADT不要用了,在2017版本已经没有了.而且这就是一个巨坑,以前打包cocos的时候,学习的时候用这个,ADT是eclipse中的一个集成的东东,已经绝版, ...
- XML模块,面向对象思想与类的定义
今日内容 XML模块,面向对象思想,类的定义 1.XML模块 xml是一种可扩展的标记语言格式如下 使用 <> 作为标签格式 <tag style: '' color:read '' ...
- 华为HCNA乱学Round 8:生成树
- C++学习笔记-多态
多态作为面向对象的重要概念,在如何一门面向对象编程语言中都有着举足轻重的作用,学习多态,有助于更好地理多态的行为 多态性(Polymorphism)是指一个名字,多种语义:或界面相同,多种实现. 重载 ...
- cm_api
cm API:https://github.com/cloudera/cm_api/tree/master/python/examples/auto-deploy#看集群有几个clustercurl ...
- (转)C++ bitset用法
今天做题发现要用到bitset,找到一篇介绍的巨好的文章. 转载自:https://www.cnblogs.com/magisk/p/8809922.html C++的 bitset 在 bitset ...
- (public丶private丶protected) 的理解
public(公有):公有的类成员可以在任何地方被访问. protected(受保护):受保护的类成员则可以被其自身以及其子类和父类访问. private(私有):私有的类成员则只能被其定义所在的类访 ...
- 比反射更快!使用ASM获取class信息(ClassReader)
比反射更快!使用ASM获取class信息(ClassReader) 通常我们想要在java运行时获取class的信息时,通常使用反射的方式来获取其中的属性,方法,注解等信息.通常是这样的: Class ...