使用 jQuery + 指定的 selector 達成, 其實很容易, 原則上只是要把第 n列後的內容先隱藏, 於需要時再顯示的概念.
當然, 若是從後端也是很容易實現, 不過目前是打算從前端做的話, 方式如下:
$(“.table tr:nth-child(n+4)”).toggle();
就這樣? 對, 就是這樣, 指定第 4筆 tr 起(含, 與之後), 會被選出來進行 toggle, 這樣一來就可以容易地在前端進行 table 內, 指定行之後的內容隱藏與顯示.
可以參考範例:
https://codepen.io/timhuang/pen/PLWrap
另外可以參考有用的選擇器方式: