这个例子演示了通过点击按钮添加一条数据到表格中
row.add()
添加一行
rows.add()
添加多行(注意多了一个s)
需要注意的是,你调用这个方法后需要重绘表格(调用 draw()
)才能看到效果
Column 1 | Column 2 | Column 3 | Column 4 | Column 5 |
---|---|---|---|---|
Column 1 | Column 2 | Column 3 | Column 4 | Column 5 |
1.1 | 1.2 | 1.3 | 1.4 | 1.5 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | $(document).ready( function () { var t = $( '#example' ).DataTable(); var counter = 1; $( '#addRow' ).on( 'click' , function () { t.row.add( [ counter + '.1' , counter + '.2' , counter + '.3' , counter + '.4' , counter + '.5' ] ).draw(); counter++; } ); // Automatically add a first row of data $( '#addRow' ).click(); } ); |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | < button id = "addRow" >添加一行</ button > < table id = "example" class = "display" cellspacing = "0" width = "100%" > < thead > < tr > < th >Column 1</ th > < th >Column 2</ th > < th >Column 3</ th > < th >Column 4</ th > < th >Column 5</ th > </ tr > </ thead > < tfoot > < tr > < th >Column 1</ th > < th >Column 2</ th > < th >Column 3</ th > < th >Column 4</ th > < th >Column 5</ th > </ tr > </ tfoot > </ table > |
Translation from DataTables.net, with permission