jQuery中的slideToggle问题

Question

我有一个表格，其中将有成千上万的记录（div元素）。每个div都是可点击的，当我点击每条记录时，隐藏在点击div下的div将使用slideToggle显示。

由于记录数量非常高，因此slideToggle的效果不是所需的效果。它只是显示div而不是滑动。

我有下面的事件处理程序代码

$("div.opendiv").click(function(){ 
    var openelem = $(this).next(); 
    openelem.slideToggle();  
}); 

我不想这些记录分为网页。

有什么我可以做的，这样slideToggle效果会平滑吗？

谢谢

Answer 1

你有没有试过设置一个持续时间去滑行效应？ 喜欢：

$("div.opendiv").click(function(){ 
    var openelem = $(this).next(); 
    openelem.slideToggle(1000);  
}); 

Answer 2

既然你是成千上万的切换之间的一个元素，所有的浏览器将显示滞后去做。比别人多一些。这与浏览器和版本的内存使用情况有关，但也与用户机器有关。显然，更好的机器可以更好地操纵更多的DOM元素。

所以，我创建了一种解决方法来帮助您：http://jsfiddle.net/9vMEV/6/。

的理念是：如果父大小是固定的，孩子滑动动画将被扼杀，因为这将是进行动画的唯一元素。所以，我更新了代码，在开始滑动子代div之前设置父代height。

将for的限制从500更改为1000，10000,50000 ......您的浏览器将无法创建更多动画。也许会在显示任何页面之前崩溃...

在我的测试中，即使有大约30000个td元素，动画也很流畅。所以这个想法在某些情况下会解决你的问题。

但是我实际上认为更好的选择，如果你不想在很多页面上分割这个大页面的话：与标签一些div一起工作，显示和隐藏其中几百个tds。在差不多父母的所有浏览器的子女与display: none不处理动画，并不会导致滞后。