Jquery easyui datagrid 行的上下移动实现方式

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70

$( function () { $( '#tt' ).datagrid({ singleSelect: false , url: '/uploads/rs/233/bkf2ntm7/datagrid_data2.json' , title: 'Easyui datagrid 行上下移动' , width: 800, height: 'auto' , fitColumns: true , columns: [[{ field: 'itemid' , title: 'Item ID' , width: 80 }, { field: 'productid' , title: 'Product ID' , width: 120 }, { field: 'listprice' , title: 'List Price' , width: 80, align: 'right' }, { field: 'unitcost' , title: 'Unit Cost' , width: 80, align: 'right' }, { field: 'attr1' , title: 'Attribute' , width: 250 }, { field: 'status' , title: 'Status' , width: 60, align: 'center' }, { field: 'ctr' , title: '操作' , width: 100, align: 'center' , formatter: function () { return '上下' ; } }]] }); }); function move(e, target, isUp) { var $view = $(target).closest( 'div.datagrid-view' ); var index = $(target).closest( 'tr.datagrid-row' ).attr( 'datagrid-row-index' ); var $row = $view.find( 'tr[datagrid-row-index=' + index + ']' ); if (isUp) { $row.each( function () { $( this ).prev().before($( this )); }); } else { $row.each( function () { $( this ).before($( this ).next()); }); } $row.removeClass( 'datagrid-row-over' ); e.stopPropagation(); }