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{ 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{ 100%; height: 35px; line-height: 35px; text-align: center; margin-top:45px; margin-bottom: 30px; } .delfoot{ 100%; height: 35px; margin-bottom: 20px; } .delcer{ float: left; margin-left: 20%; 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%; 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() }) }