展開和摺疊jQuery的

錶行這裏是jQuery code爲expanding and collapsing the rows in a table，但它似乎沒有工作。我哪裏錯了？展開和摺疊jQuery的

$('.Complex').click(function() { 
    if ($(this).hasClass("collapsed")) { 
     $(this).nextUntil('tr.Complex') 
      .find('td') 
      .parent() 
      .find('td > div') 
      .slideDown("fast", function() { 
       var $set = $(this); 
       $set.replaceWith($set.contents()); 
      }); 
     $(this).removeClass("collapsed"); 
    } else { 
     $(this).nextUntil('tr.Complex') 
      .find('td') 
      .wrapInner('<div style="display: block;" />') 
     $(this).addClass("collapsed"); 
    }.parent() 
     .find('td > div') 
     .slideUp("fast"); 
});

以下是的jsfiddle

https://jsfiddle.net/uxc3fkcm/

來源

2015-06-02 Aishwarya L

你有'語法錯誤} .parent（）' - https://jsfiddle.net/arunpjohny/p0ujay76/2/- 應該是'$（this）.parent（）' –

感謝您幫助我修復我的代碼！（： –

你已經在它複雜化。只需使用$.fn.toggleClass()和$.fn.toggle()

$('.Complex').click(function() { 
    $(this).toggleClass("collapsed").nextUntil('tr.Complex').toggle(); 
});

DEMO

如果您想滑動然後使用$.fn.slideToggle()代替$.fn.toggle()

顯示或隱藏用滑動匹配的元素。

來源

2015-06-02 10:12:57 Satpal

）這樣做更清晰，更易於理解！（：非常感謝！（： –

你已經寫了.parent（）後面的else case和use display none;而不是顯示塊;

$('.Complex').click(function(){ 
    if($(this).hasClass("collapsed")){ 
     $(this).nextUntil('tr.Complex') 
     .find('td') 
     .parent() 
     .find('td > div') 
     .slideDown("fast", function(){ 
      var $set = $(this); 
      $set.replaceWith($set.contents()); 
     }); 
     $(this).removeClass("collapsed"); 
    } 
    else 
    { 
     $(this).nextUntil('tr.Complex') 
     .find('td') 
     .wrapInner('<div style="display: none;" />') 
     $(this).addClass("collapsed"); 
    } 
    }

來源

2015-06-02 10:25:55 vinni

）實際上，當表格作爲一個整體顯示時，這並不適用。 –

也許試試這個：d

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

$(function() { 
    $("td[colspan=3]").find("p").hide(); 
    $("table").click(function (event) { 
     event.stopPropagation(); 
     var $target = $(event.target); 
     $target.closest("tr").nextAll().find("p").slideToggle(); 

    }); 
});

工作對我來說希望對你有用2：d

來源

2016-04-29 10:10:51

展開和摺疊jQuery的

回答

相關問題