<分区>
jquery - 删除单击的jquery时如何删除整个div行
我有一个列表页面，显示从数据库中获取的消息。
如何在单击红色 X 按钮时删除整个 div，包括该按钮本身并在之后自动调整列表。
我将其作为 col-md-12 与 col-md-4*5*2*1 的子项一起制作。列。
HTML
<div class="col-md-12" style="background-color:white;padding:15px;">
<div class="col-md-2">
<a href="#">
<img class="media-object" style="" src="<?php echo base_url($message->media->file_name);?>" data-holder-rendered="true" style="width: 80px; height: 80px;float:left:padding:5;">
</a>
</div>
<div class="col-md-2 column_border">
<div class="full_name" style="float:right;padding:5px;">
<a href="<?php echo base_url('sell/seller').'/'.$message->profile_id;?>">
<?php echo $message->full_name;?></a>
<p class='state' style="font-weight:100;"> <?php echo $message->city.' '.$message->state;?></p>
<p>
<i class='messages glyphicon glyphicon-record' style='color:#69DA32;padding-right:2px;'></i>User is online
</p>
</div>
</div>
<div class="col-md-5">
<div class="message_content column_border" style="float;left;padding:5px;">
<span class="subject"> <?php echo $message->subject;?></span>
<p class='messages'>
<?php echo $message->message_text;?>
</p>
</div>
</div>
<div class="col-md-2">
<div class="date_column" style="float:left;padding:5px;">
<span class="date"> <?php echo $message->date;?></span>
<p class='messages'> <?php echo $message->time;?></p>
</div>
</div>
<div class="col-md-1" >
<div class="message_content" style="float:right;padding:5;">
<a href="#"><i class='glyphicon glyphicon-remove' style='color:red;padding-right:2px;'></i></a>
</div>
</div>
</div>
谢谢
最佳答案
使用点击处理程序删除按钮。使用 .closest() 选择器和 .remove() 遍历到类 col-md-12 最近的行以将其删除:
$('.glyphicon-remove').click(function(){
$(this).closest('.col-md-12').remove();
});
关于jquery - 删除单击的jquery时如何删除整个div行，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31580921/