jquery实现更改表格行顺序示例

2020-05-24 21:19:25易采站长站整理

            </td>
        </tr>
    </tbody>
</table>


js代码,其中会为要变更的行在变更顺序后加上class=danger



<script type=”text/javascript”>
$(function(){
  $(‘.move_btn’).click(function(){
    var move_act = $(this).attr(‘move_act’);
    $(‘#test_table tbody tr’).removeClass(‘danger’);


    if(move_act == ‘up’){
      $(this).parent().parent(‘tr’).addClass(‘danger’)
             .prev().before($(this).parent().parent(‘tr’));
    }
    else if(move_act == ‘down’){
      $(this).parent().parent(‘tr’).addClass(‘danger’)
             .next().after($(this).parent().parent(‘tr’));
    }
    setTimeout(“$(‘#test_table tbody tr’).removeClass(‘danger’);”, 2000);
  });
});
</script>


更改后可以按照每行的唯一标记提交新的顺序