jQuery隱藏/顯示div onclick範圍

我試圖讓一個項目的jQuery的擺動，我拿起一些東西在這裏那裏，但每隔一段時間，我打了一個笨蛋。jQuery隱藏/顯示div onclick範圍

在此的jsfiddle你可以看到我的工作：http://jsfiddle.net/YpeeR/17/

jQuery(document).ready(function() { 
jQuery('.toggle_hide').hide(); 

jQuery("#background_absolute_content li span").css('cursor', 'pointer').click(function() { 
    var $this = $(this); 
    $('.toggle_hide').not($this.next("div")).fadeOut(200, function() { 
     $this.next("div").fadeIn(200); 
    }); 
});

}）;

我有4個div隱藏在li元素中。當用戶點擊div元素內部的span標籤和其他div被關閉時，div會顯示出來。這工作正常，但我想用戶能夠切換當前股利。

所以，當用戶點擊li元素中的跨度時，隱藏的div會顯示出來，而當用戶再次單擊相同的跨度時，我希望div再次隱藏。

不幸的是fadeToggle似乎並沒有這樣的伎倆propper，你可以在這裏看到http://jsfiddle.net/YpeeR/18/，但我似乎無法弄清楚這是爲什麼......

來源

2011-08-20 Peter Boomsma

我可以看到你瞭解如何**堆棧溢出* ***作品！ '問題'... jsFiddle ...評論...現在告訴我們...是否很難接受答案？ –

我放慢下來以顯示更改：http://jsfiddle.net/YpeeR/23/

jQuery(document).ready(function() { 
    jQuery('.toggle_hide').hide(); 

    jQuery("#background_absolute_content li span").css('cursor', 'pointer').click(function() { 
     var $this = $(this); 
     $this.next("div").fadeToggle(200); 
     $('.toggle_hide').not($this.next("div")).fadeOut(800); 
    }); 
})

你分別致電$this.next("div").fadeIn(200); 3次，每次DIV，而不是$ this.next，一旦他們完成的動畫。

來源

2011-08-20 16:22:16 Joe

Wauw謝謝！這樣做的竅門是，這個jQuery非常棒，但有點討厭bugfix，但今天學到了很多東西。 –

@彼得，沒問題！樂意效勞。請閱讀：http://meta.stackexchange.com/questions/16721/how-does-accept-rate-work – Joe

由於您將fadeToggle放置在其他div的fadeOut的回調中，因爲存在其他三個div，所以這被稱爲三次。所以它每次點擊三次，你會看到它閃爍一次。試試這個：

jQuery(document).ready(function() { 
    jQuery('.toggle_hide').hide(); 

    jQuery("#background_absolute_content li span").css('cursor', 'pointer').click(function() { 
     var $this = $(this); 
     $('.toggle_hide').not($this.next("div")).fadeOut(200); 
     $this.next("div").fadeToggle(200); 
    }); 
});

http://jsfiddle.net/Paulpro/YpeeR/25/

來源

2011-08-20 16:26:38 Paulpro

jQuery隱藏/顯示div onclick範圍

回答

相關問題