无法从具有删除功能的ContentFlow coverflow轮播中删除所有对象

时间:2014-03-01 18:42:27

标签: javascript contentflow

在我描述我的问题之前,我想详细说明我正在尝试的内容

我在这里要做的是根据用户可以按下的按钮将不同的项目集加载到内容流中。我已经设置了一个由按钮触发的函数,该按钮将获取与我通过AJAX传递给它的名称值相关联的项目(使用jQuery $ .get)并输入ID为itemcontainer的div。这很有效。

function getPictures(Gallery){
$.get( "getimages.php", {name : Gallery}, function( data ) {
for(x in data){
    $("#itemcontainer").append(data[x]);
}
addPictures();
}, "json" );
return false;

}

您将看到该函数调用其中的另一个函数(addPictures()),它实际上通过ContentFlow的addItem方法将图片添加到具有itemcontainer ID的div中的ContentFlow轮播。

     function addPictures(){ 
        clearBox();
        var it = ajax_cf.items;
        // Grabs pictures from 'itemcontainer' and iteratively adds them to 'flow'
        var ic = document.getElementById('itemcontainer');
        var is = ic.getElementsByTagName('img');
        for (var i=0; i< is.length; i++) {
          ajax_cf.addItem(is[i],"end");
        } 
      }  

你会注意到addPictures()函数里面有一个我之前声明的函数clearBox()。 clearBox()应该遍历我的内容流中的项目并删除它们,这样我就可以在加载新的项目之前删除ContentFlow轮播中的旧项目库。

它通过循环遍历列表项(称为项)来工作,这是ContentFlow对象的属性ajax_cf我在每个项的索引0处的list元素上创建并运行方法rmItem。这是clearBox函数。

 var ajax_cf = new ContentFlow('ajax_cf');
      function clearBox(){
        alert("clear");
        var it = ajax_cf.items;
        var len = it.length;
        for(var i=0; i<len; i++){
         ajax_cf.rmItem(0);
        } 
        return false;
      }

如果您需要,可以在此处获取源文档或文档。 http://www.jacksasylum.eu/ContentFlow/

提前致谢!

1 个答案:

答案 0 :(得分:0)

我不知道你是否已经解决了这个问题,但这是一个想法。由于这些对象位于DOM中,因此请尝试使用clearBox()方法删除itemcontainer中的项目。所以你的方法看起来像:

function clearBox()
{
    alert("clear");
    var images = $('itemcontainer').children();

    for (var i = 0; i < images.length; i++)
    {
        $('itemcontainer').remove(images[i]);
    }
}

这样,您强制ContentFlow对象删除图像,当您的addPictures方法继续时,它将基本上重新初始化ContentFlow轮播。

这是未经测试的,但从逻辑上看它似乎可行,因为所有ContentFlow库的rmItem方法都会从DOM中删除对象,所以你选择自己这样做。