如何删除使用 Ajax 调用的 div答案

【问题标题】：How to remove a div called with Ajax如何删除使用 Ajax 调用的 div
【发布时间】：2012-02-26 04:23:02
【问题描述】：

大家好，我正在寻求帮助。

我有一个 php 页面，在这个页面中我有一些返回 div 的 ajax 调用... 在其中一个 div 中我有一个按钮，如果单击此按钮，我必须删除按钮所在的整个 div ..

这是我的代码，现在不工作:(

$(document).ready(function() {
$("#tutn").live('click',function(e){
   $("#first_time",e).remove() ;
   e.preventDefault() ; 
});});

其中 id="first_time" 是一个用 ajax 调用的 div ......这是我的问题......因为即使我点击按钮，div 也不会删除...... 在其他世界中，我必须删除按钮所在的 div 的父亲

这是html代码

<div id="first_time">
     <div class="ft_info">
         <input type="button" name="tutn" id="tutn" class="tutbtn" value="no" />
    </div>
</div>

【问题讨论】：

对于任何访问此问题的人。 .live 已弃用，因此您必须改用 .on。根据 api.jquery.com/live - 从 jQuery 1.7 开始，.live() 方法已被弃用。使用.on() 附加事件处理程序。旧版本 jQuery 的用户应该使用.delegate() 而不是.live()。

【解决方案1】：

如果你想删除 id 为 first_time 的 div，你可以这样做：

$(document).ready(function () {
     $("#tutn").live('click', function (e) {
         $("#first_time").remove();
     });
});

但如果 id 是动态变化的，那么你可以这样做：

$(document).ready(function () {
         $("#tutn").live('click', function (e) {
             $(this).parent().parent().remove();
         });
});

【讨论】：

【解决方案2】：

作为另一种选择，您可以通过对$(this) 上的parent() 方法的两个链式调用来删除按钮的“祖父”，其中this 是按钮元素。

$(document).ready(function() {
$("#tutn").live('click',function(e){
   e.preventDefault() ; 
   $(this).parent().parent().remove();
});});

【讨论】：

【解决方案3】：

你的错误在第 3 行：

$("#first_time").remove() ;

这里的 e 是错误的。我想知道你没有收到 js 错误。

但我也建议使用 parent()。

$(document).ready(function() {
    $("#tutn").live('click',function(e){
       $(this).parent().parent().remove();
    });
});

你必须使用 parent() 两次才能获得 $('#first_time')。

而且我不会使用 ID。我会用类来解决问题。

【讨论】：

【解决方案4】：

只需一个小改动就可以解决它...

$(document).ready(function() {
    $("#tutn").live('click',function(e){
       $("#first_time").remove() ;
       e.preventDefault() ; 
    });
});

我刚刚从删除选择器中删除了,e，因为它是错误的。

【讨论】：

【解决方案5】：

如果你确定 div 存在并且它的 ID 是first_time，那么就这样做

$('#first_time').remove();

第二个参数应该是一个现有的 DOM 节点，jQuery 将开始选择元素的起点。您似乎正在传递 event 对象，这不是 jQuery 所期望的。

此外，无需将第二个参数传递给 ID 选择器，因为 ID 在文档中必须是唯一的。

关于样式的最后一点说明：不要在分号前放置空格，也不要通过嵌套多个结束 }) 对来“节省空间”。这太恶心了：

$(document).ready(function() {
$("#tutn").live('click',function(e){
   $("#first_time",e).remove() ;
   e.preventDefault() ; 
});});

如果您想被认真对待，必须采用某些例外的编码标准：

$(document).ready(function () {
   $("#tutn").live('click', function (e) {
     $("#first_time",e).remove();
     e.preventDefault(); 
  });
});

【讨论】：

【解决方案6】：

您不能从上下文 e 中选择 div#first_time。

只需将$("#first_time",e).remove() ; 更改为$("#first_time").remove() ;

【讨论】：