需要回拨，不知道

我的问题是这样的。我在<ul>元素中创建了<li>列表。当你点击其中一个元素时，其他元素消失。现在当你点击[See all items]时，以前的列表出现agen。但是现在当你点击其他元素时，什么也没有发生。这应该是因为新元素不知道什么时候点击它。我们需要一个回调！但是我不明白应该怎样写回这个回调函数？！需要回拨，不知道

我的代码：http://jsfiddle.net/cRcNB/。在JS部分有easying.js和quicksand.js befor。所以向下滚动（一路），你会看到我的（短）代码。 :)

我会在这里发布我的代码问：

$(document).ready(function(){ 
    var $holder = $('ul.holder'); 
    var $data = $holder.clone(); 

    $('ul.holder li').click(
     function(e){ 
      $holder.quicksand($(this),{ 
       duration: 800, 
      }); 
     return false; 
    }); 
    $('#all').click(
     function(e){ 
      $new = $data.find('li') 
      $holder.quicksand($new,{ 
       duration: 800 
      } 
     ); 
     return false; 
    }); 
})

HTML

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 
</head> 
<body> 
    <ul> 
     <li id='all'>[See all items]</li> 
    </ul> 
    <ul class='holder'> 
     <li data-id="1" data-type="a">heaven</li> 
     <li data-id="2"data-type="b">love</li> 
    </ul> 
</body> 
</html>

Quiksand1.3.js和Easing.js需要为好。

来源

2013-02-19 Mihkel L.

你为什么要克隆'$ holder'？ – Ian 2013-02-19 18:55:37

所以我可以返回之前的列表。流沙替换一个列表与其他:)所以持有人总是被取代。但我将永远有原始列表:) – 2013-02-19 18:57:37

尝试更换

$('ul.holder li').click(
    function(e){ 
     $holder.quicksand($(this),{ 
      duration: 800, 
     }); 
    return false; 
});

：

$('ul.holder').on('click', 'li', function(e){ 
     $holder.quicksand($(this),{ 
      duration: 800, 
     }); 
    return false; 
});

这将click处理程序绑定到<ul>这始终是在DOM。当你删除<li>的时候，你也扔掉了他们的点击处理程序。这可能是问题所在。

来源

2013-02-19 19:02:20 andyzinsser

Aaaa ...这是美丽的男人：P，并解决了问题。但仍然不知道如何解决它回电话：D – 2013-02-19 19:13:36

下面是代码的简化版本：

标记：

<ul> 
    <li id='all'>[See all items]</li> 
</ul> 
<ul class='holder'> 
    <li data-id="1" data-type="a">heaven</li> 
    <li data-id="2"data-type="b">Earth</li> 
    <li data-id="2"data-type="b">Dirt</li> 
    <li data-id="2"data-type="b">Peace</li> 
    <li data-id="2"data-type="b">More</li> 
</ul>

的jQuery：

$("#all").on("click",function(){ 
    $(".holder li").show("slow"); 
}); 
$(".holder li").on("click",function(){ 
    $(".holder li").not($(this)).hide("slow"); 
});

的jsfiddle：http://jsfiddle.net/5ChVE/5/

来源

2013-02-19 19:15:45

很好，谢谢你的帖子:) – 2013-02-22 17:57:24

你可以添加更多关于“选择”如何工作的文档。我看不到你添加了一个类似这样的类，那么这里的交易是什么？ – 2013-02-23 17:29:31

我删除了它，它是早期尝试的一部分。 – 2013-02-23 19:22:48

需要回拨，不知道

回答

相关问题