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动态向页面中添加表格
我们在实际开发中经常会想要实现如下情况: 点击某个按钮,然后动态的网页面里面添加一个表格或者一行,这个更加灵活方便.但是实现起来肯定不能像在页面里面直接写标签来的容易,以下是我项目中的代码,拿过来分享 ...
随机推荐
- 刷新页面后,让控制台的js代码继续执行
在各种限时,秒杀活动中,有个自动循环的点击的工具是很重要的. 为了方便起见,我们把Js代码放在浏览器的控制台执行,但是刷新页面后,js代码就清空了,也就无法执行. 可以用js代码实现一个不受页面刷新影 ...
- selenium+java:获取列表中的值
selenium+java:获取列表中的值 (2011-08-23 17:14:48) 标签: 杂谈 分类: selenium 初步研究利用java+testNg框架下写selenium测试用例,今天 ...
- 自然语言处理NLP学习笔记三:使用Django做一个NLP的Web站点
前言: 前面我们已经能初步实现一个中文自然处理语言的模型了,但交互界面是命令行的,不太友好. 如果想做一个类似http://xiaosi.trs.cn/demo/rs/demo的界面,那就还需要继续往 ...
- 3D玫瑰花
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- Macaca环境搭建(一)----windows系统macaca安装
一.安装JDK, 1.官方网站:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html ...
- Python3图片处理头像
一. 简介: Python3图片处理头像右上角类似QQ,微信右上角未读信息效果,其实没有实质作用,只是简单练习. 1. 环境: python3.5 random模块:生成随机数 PIL模块:图像处理模 ...
- Ubuntu19.04系统SSH连接CentOS7虚拟机
一.为CentOS7配置静态IP 注意查看宿主机(Ubuntu19.04)所在局域网段,当前为172.18.25.108 修改当前系统下virtual box的网络设置 [控制]-->[设置]- ...
- Tomcat解析XML和反射创建对象原理
Tomcat解析XML和反射创建对象原理 import java.lang.reflect.InvocationTargetException; import java.lang.reflect.Me ...
- SQL之事务
●事务的ACID(acid)属性 ➢1.原子性(Atomicity ) 原子性是指事务是-一个不可分割的工作单位,事务中的操作要么都发生,要么都不发生. ➢2. 一致性(Consistency) 事务 ...
- Java 条件语句 if else
一个 if 语句包含一个布尔表达式和一条或多条语句. 语法 if 语句的语法如下: if(布尔表达式) { //如果布尔表达式为true将执行的语句 } 如果布尔表达式的值为 true,则执行 if ...