jquery-ui sortable table - 选定行调整大小 table 和 table 行内容移位

jquery-ui sortable table - selected row resizing table and table row contents shift

我的codepen has a jquery-ui sortable on a table. A few problems that I see are: 1) selecting a row to drag adjusts table width during selection, but resumes to the correct table width after it is dropped. 2) The selected table row shifts outside of left border of the table containment. 3) The selected table row loses the table styling. The data scrunches up apparently losing its default padding-right of 10px.

我是 运行 Windows 7 并使用 chrome 浏览器版本 56.0.2924.87 有人可以回答我在 post 之前对 post 代码的冗余需求吗? 将最低限度的代码放在这里。完整代码见笔。

<table class="playlist-table">

我在发布问题之前找不到这个问题:

jquery UI Sortable with table and tr width

感谢 Yaroslav 的帮助 class 解决了问题 #3。所选 table 行现在在被选中后保留样式。

.ui-sortable-helper {
    display: table;
}

对于 Keith,他的代码解决了以下问题 1) 选择要拖动的行会在选择过程中调整 table 宽度。 2) 所选 table 行移出 table 包含的左边界。

$('td, th', '.playlist-table').each(function () {
    var cell = $(this);
    cell.width(cell.width());
});