需要回撥，不知道

我的問題是這樣的。我在<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

需要回撥，不知道

回答

相關問題