2014-08-27 96 views
2

我在StackOverflow上發現了幾個類似的問題,但是我無法爲自己找出解決方案。jQuery slideToggle添加空白區域

當您重複展開和摺疊表格時,它將空行添加到表格的頂部。我如何消除這種行爲?

是最容易看到我的小提琴:My Code

這裏是我的jQuery

$(function() { 
    $('.header').click(function() { 
     $(this).nextUntil('tr.header').slideToggle(0); 
    }); 
}); 

這裏是CSS:

tr.header { 
    cursor:pointer; 
} 

這裏是HTML(縮短爲了這個問題):

<table align="center"> 
<tr class="header"> 
    <td colspan="6" style="text-align:center;font-weight:bold">20 Accounts are Uninsured - Click to Expand</td> 
</tr> 
<tr style="display: none;"> 
    <td width="120">Account Number</td> 
    <td width="200">Borrower</td> 
    <td width="200">CoBorrower</td> 
    <td width="220">Vehicle</td> 
    <td width="110">VIN</td> 
    <td width="120" align="center">View Policy Info</td> 
</tr> 
<tr style="display: none;"> 
    <td> 
     <div align="center">46546</div> 
    </td> 
    <td>Jerry Junko</td> 
    <td></td> 
    <td>2004 Ford F-250 SD</td> 
    <td>4SD65S46D4S6D</td> 
    <td style="text-align:center"><a href="">View</a> 

    </td> 
</tr> 
</table> 
+0

隨着'.slideToggle(0)'你不即使考慮幻燈片的優勢。如果你把它改成'.toggle()',問題就會消失。可能是jQuery版本中的一個小故障。 – j08691 2014-08-27 16:08:06

+0

我確實在1000,但將其更改爲0進行測試。切換到切換工作,謝謝。 – user1080943 2014-08-27 16:13:03

回答

2

好,非常棘手的一個,但我發現這個問題屬於jQuery的你是指即1.6.4。一旦你改變它,你將不會再看到這個故障。

我建議您使用1.11.x或2.x.x的最新版本。這些庫具有非常好的性能優化和新的API和功能集。 jQuery 1.6.4相當陳舊。

工作小提琴:http://jsfiddle.net/6u0580jq/2/

+0

也看到它在w/jQuery 1.7.2的小提琴..遠離1.8.3 – twill 2014-08-27 16:23:35

+0

是的,舊的jQuery庫有問題。如'1.6.x'和'1.7.x' – 2014-08-27 16:24:53