0

50行のテーブルがあるとします。そのテーブルには親子関係があります。親の行をクリックして、すべての子の行を展開/折りたたみしようとしています。私はそれを機能させていますが、行のセットを1つのセットとしてslideUpしたいと思います。どうすればいいですか？

ユーザーがtr内のリンクをクリックしたとします。これは、ユーザーが行内のリンクをクリックしたときの関数の例です。TODOに注意してください：それが私が解決しようとしていることです。

  var row = $(this).closest("tr")

    while(true) {

       if(parseInt(row.attr("data-Level"), 10) > selectedRowLevel)
{
    // TODO: I want to put all these rows in a queue maybe and the slideUp all together, not just row by row.
    row.slideToggle();
}
else
break;

row = row.next();

}
4

2 に答える 2

0

JavaScriptではテーブルの行を上下にスライドさせることはできません。表示/非表示のみが可能です。これは、テーブルのレンダリング方法の制限にすぎません。

この方法でアニメーション化できるのは、ブロックレベルの要素のみです。行をdivに置き換え、セルを固定幅のスパンに置き換えると、アニメーションを取得できます。

http://jsfiddle.net/mblase75/WgN2N/

HTML：

<div class="tr">
    <span class="td">asdf</span>
    <span class="td">qwer</span>
    <span class="td">zxcv</span>
</div>

CSS：

.td {
    display: inline-block;
    width: 100px;
    height: 20px;
    padding: 10px;
    background: #eee;
}
.tr {
    display: block; 
}
​
于 2012-12-10T21:27:31.457 に答える
-1

これらの指定されたすべての行に新しいクラスを追加します。

次に、その新しく作成されたクラスでslideUp()またはを実行します。slideDown()

于 2012-12-10T21:15:29.247 に答える