删除javascript创建的内容

Question

我有一些java脚本工作在导航菜单后面，用户单击导航按钮，并且一些AJAX触发并引入一些HTML，我想要的是如果再次单击相同的链接，则由该特定按钮加载的内容将从标记中移除。

有没有人有想法？我的代码目前为

$("#Blog").click(function (ev) { 
     ev.preventDefault() 
      var url = $(this).attr("href"); 
      $.ajax ({ 
       url: "index.php/home/category", 
       type: "GET", 
       success : function (html) { 
      //alert("Success"); 
        $("#accordion").append(html); 
       } 
      }); 
     }); 

Answer 1

$("#accordion").append(
    $("<div class='AJAXContend' />").append(html) 
); 

然后你就可以轻松做到$('.AJAXContend').remove();。

另一种选择是做$('#accordion :last-child').remove();，但这是有点哈克。

Answer 2

$("#Blog").click(function (ev) { 
     ev.preventDefault(); 

缺少的preventDefault后面的逗号。

Answer 3

所以我不知道jQuery足以以这种方式回答，但为什么不使用简单的布尔开关？

// Pseudo: 
If clicked and the switch is false, show the HTML, and set the Switch to True 

If clicked and the switch is true, hide the HTML, and set the Switch to False 

这应该解决问题。

下面的代码可能是可怕的错误，但我会用它来解释我的想法：

//Global Variables 
var switch = false; 

//Function 
if(!switch) 
{ 
    $("#Blog").click(function (ev) { 
     ev.preventDefault() 
      var url = $(this).attr("href"); 
      $.ajax ({ 
       url: "index.php/home/category", 
       type: "GET", 
       success : function (html) { 
       //alert("Success"); 
        $("#accordion").append(html); 
       } 
      }); 
     }); 

    switch = true; 
} 
else 
{ 
    $("#accordion").innerHTML = ""; 
    switch = false; 
} 

Answer 4

尝试使用.toggle代替。点击的：

这将允许你添加第二个功能当再次点击按钮时删除内容。

$("#Blog").toggle(function (ev) { 
    ev.preventDefault(); 
    var url = $(this).attr("href"); 
    $.ajax ({ 
     url: "index.php/home/category", 
     type: "GET", 
     success : function (html) { 
      //alert("Success"); 
      $("#accordion").append(html); 
      } 
     }); 
    }, 
    function (ev) { 
     // remove content from accordion here 
    });