使用jQueryUI排序删除行时的1个额外表格单元格(仅限Chrome)

Question

我有一个使用jQuery,jQuery UI和Backbone.js的应用程序.最近开发了一个错误,其中表中的一行被删除(jQUery Sortable)时,另一行有时会移动一行,好像有一个额外的单元格,但是在检查时没有.我刚才注意到这只发生在Chrome,Chromium和ChromeFrame中.

以下是问题区域的屏幕截图:http://img208.imageshack.us/img208/6870/screenshotkz.png

以下是Chrome检测界面中HTML的屏幕截图:http://img16.imageshack.us/img16/6985/screenshot1wdo.png 我还复制了以下HTML:

<tr id="17052151" class="wo">
<td>17052151</td>
<td>XXXXXXXXXXX</td>
<td>XXXXXXXXXXXXX</td>
<td>Parts Here</td>
<td>RR</td>
<td>10/28/11</td>
<td>10/28/11</td>
<td>10</td>
<td><input type="text" class="woComment" value=""></td>
<td class="removeWO">X</td>
</tr>
<tr id="10097756" class="wo">
<td>10097756</td>
<td>XXXXXXXXXXXX</td>
<td>XXXXX</td>
<td>Parts Here</td>
<td>NIS</td>
<td>10/04/11</td>
<td>10/28/11</td>
<td>10</td>
<td><input type="text" class="woComment" value=""></td>
<td class="removeWO">X</td>
</tr>
<tr id="10095965" class="wo">
<td>10095965</td>
<td>XXXXXXXX</td>
<td>XXXXXXXXXXXXXXXX</td>
<td>Parts Here</td>
<td>NIS</td>
<td>09/16/11</td>
<td>10/10/11</td>
<td></td>
<td><input type="text" class="woComment" value=""></td>
<td class="removeWO">X</td>
</tr>

由于在Firefox或IE8中没有出现此问题,我认为这可能是Chrome错误,但我想看看之前是否还有其他人遇到此问题.

编辑 我发现调用.render()我的视图元素的函数发生问题修复了这个问题.

Answer 1

也许我完全没有理解你的观点，但你能否澄清一下：你确实希望整行都可以排序，这意味着第 1 行、第 2 行和第 3 行可以通过拖动来互换？

如果是这种情况，您实际上应该使 tbody 成为可排序的，而不是 tr；将可排序应用于 tr 是导致这里出现奇怪行为的原因，因为 jqueryui 试图使 tr 的内容可排序，这非常糟糕。要对行进行排序，请使 tbody 可排序，以便它尝试对表行进行排序。

http://jsfiddle.net/cZ4n4/10/