0

我创建了一个自定义项目列表。它不是一个常规的 html 列表元素，它是基于 div 的自定义项目列表，带有 Jquery onclick 事件。这是我的 Jquery 代码：

 $(document).ready(function(){

  $(document).find("div[id^='cat']").live('click', function()
  { 
var currentId = $(this).attr('id');
$.getJSON('get_categories.php', {catName:$("#"+currentId).text()}, function(data) 
{
    $.each(data.CatList, function(i,itemList)
    {
        var tblRow =
        "<div class='shop_options' id='cat" + itemList.id + "' onclick=''"  +">"
        +itemList.sub_cat+"</div>";
        $(tblRow).appendTo("#subCatList");

    });

});

  });

 });

我可以通过 onclick 根据主类别项目附加子类别。但问题是，每当我单击任何其他类别以填充子类别数据时，单击一个类别后，它只会修改其他类别数据以及先前选择的主类别项目列表。

例如，如果我选择Fruits，则它会显示数据Mango、Banana、Orange并且每当我选择任何其他类别（如Flowers ）时，它都会在 Fruits 子类别列表下方显示 Flowers 的子类别列表Rose、Lotus、Marigold 。

我想清除之前选择的类别项目。如何做到这一点，请给您的专家建议。提前谢谢了。

4

2 回答 2

0

采用

$("#subCatList").empty();

在追加之前。

于 2013-01-03T10:34:31.127 回答
0

用于html()使 div 为空

$.getJSON('get_categories.php', {catName:$("#"+currentId).text()}, function(data) 
{

  $("#subCatList").html()  //here add this

  $.each(data.CatList, function(i,itemList)
  {
    var tblRow =
    "<div class='shop_options' id='cat" + itemList.id + "' onclick=''"  +">"
    +itemList.sub_cat+"</div>";
    $(tblRow).appendTo("#subCatList");

  });

});
于 2013-01-03T10:34:39.463 回答