2011-05-31 174 views
0

我正在開發一個在線購物網站。我有一個展開/摺疊jQuery設置。但理想情況下,我希望當用戶點擊崩潰時,購物車項目的完整列表會崩潰而無法看到。目前,如果用戶在購物車中有多個商品,則只會關閉1個商品。展開/摺疊jQuery

如何級聯此項以關閉所有項目?

例子是here

回答

2

嘗試使用:

$(".toggle_container").slideToggle('2000'); 

此刻你的代碼只是找到的第一個項目,滑起來。

你也可以附上所有項目在主DIV和動畫,與其爲相同的效果:

<div class="order_items"> 
    <div class="toggle_container">...</div> 
    <div class="toggle_container">...</div> 
    <div class="toggle_container">...</div> 
</div> 

用下面的JS:

$(".order_items").slideToggle('2000'); 
+0

謝謝,更改jQuery爲.order_items工作的一種享受! – StuBlackett 2011-05-31 10:09:13

2

將所有你想要的元素在你用jQuery定位的容器中摺疊。在這種情況下:.toggle_container。

僞標記:

<div class="toggle_container"> 
    <div class="product"></div> 
    <div class="product"></div> 
    <div class="product"></div> 
</div> 
1

根據劇本,它改變了下一個元素的狀態。您需要重新編寫HTML以在項目周圍包含一個包裝div,並重新分配腳本以摺疊包裝。

的jQuery:

$("h2.trigger").click(function(){ 
     $(".items_wrapper").slideToggle(2000); 
     return false; //Prevent the browser jump to the link anchor 
    }); 

HTML:

<h2 class="trigger"><a href="#">Click me!</a></h2> 

<div class="items_wrapper"> 
    <div class="toggle_container">...</div> 
    <div class="toggle_container">...</div> 
    <div class="toggle_container">...</div> 
</div> 

Example for you here