jQuery UI排序（'取消'） - this.helper为空

Question

我试图禁用可排序元素排序时，它已被双击。当我尝试禁用它时，即使没有条件，它也会给出错误'this.helper is null'。

$('.roundedBox:first', division).sortable({ 
    start: function(event, ui) { 
     if(true === true) { 
      $(this).sortable('cancel'); 
     } 

     $(this).parent().data('sorting', true); 
    }, 
    stop: function() { 
     $(this).parent().data('sorting', false); 
    }, 
    items: '.department', 
    update: function() {}, 
    placeholder: 'department-placeholder' 
}) 

有关我如何做到这一点的任何想法？我不需要它是这种方法。从字面上来说，任何阻止它的东西都会起作用。

问题是，单击就开始排序，但我有另一个操作绑定到双击。如果它被双击，我不希望它拖动。

---

编辑

后拉斯C（谢谢）引发了进一步的调查，我发现，这个问题是不是在排序本身，而是与其他两个插件组合：

jEditable（ http://www.appelsiini.net/projects/jeditable） jQuery上下文菜单（http://abeautifulsite.net/2008/09/jquery-context-menu-plugin/）

后者是实际导致问题的原因。因为jEditable h3标签是在一个可排序的div内，而它又在具有jQuery上下文菜单的分区内，我相信它正在做一些工作来阻止传播（没有最后一个插件，一切工作正常）。

要重现需要以下问题：

HTML

<div class="division"> 
    <div class="roundedBox"> 
     <div class="department" id="dDeppresident_test"> 
      <h3>Test</h3> 
      <a href="#" title="Menu" class="icon menu hover-icon"><img src="/images/icons/menu-colored.png" alt="Menu" height="15" width="15"></a> 
     </div> 
    </div> 
</div> 

<ul id="uDepartmentMenu" class="hidden contextMenu"> 
    <li><a href="#editDepartment" class="edit" title="Edit Department">Edit Department</a></li> 
    <li><a href="#removeDepartment" class="remove" title="Remove Department">Remove Department</a></li> 
</ul> 
<ul id="uDivisionMenu" class="hidden contextMenu"> 
    <li><a href="#editDivision" class="edit" title="Edit Division">Edit Division</a></li> 
    <li><a href="#addDivision" class="add" title="Add Division">Add Division</a></li> 
    <li><a href="#removeDivision" class="remove" title="Remove Division">Remove Division</a></li> 
    <!--<li><a href="#move" title="Move Division">Move Division</a></li>--> 
    <li class="separator"><a href="#addDepartment" class="add" title="Add Department">Add Department</a></li> 
</ul> 

jQuery的

// Add context menu to menu icon 
$('.division').contextMenu({ 
    menu: 'uDivisionMenu' 
}, function(){}); 

// Add Sorting 
$('.roundedBox').sortable({ 
    start: function(event, ui) { 
     //$(this).parent().data('sorting', true); 
    }, 
    stop: function() { 
     //$(this).parent().data('sorting', false); 
    }, 
    items: '.department', 
    update: function() {}, 
    placeholder: 'department-placeholder' 
}); 


// Make the division names editable 
$('.department h3').editable('/ajax/save-department-name.php', { 
    indicator : 'Saving...', 
    tooltip  : 'Double click to edit...', 
    event  : 'dblclick' 
}); 

// Add context menu to menu icon 
$('.department a.menu').contextMenu({ 
    menu: 'uDepartmentMenu', 
    leftButton: true 
}, function(){}); 

// Make the departments show remove icon when you hover it 
$('.department').live('mouseover', function() { 
    $('.hover-icon', $(this)).show(); 
}).live('mouseout', function() { 
    $('.hover-icon', $(this)).hide(); 
}); 

这里你可以看到一个测试实例（链接将在稍后的日期被删除） ： http://www.realstatistics.com/testing/

如果您从jQuery代码中删除此部分，则一切正常：

// Add context menu to menu icon 
$('.division').contextMenu({ 
    menu: 'uDivisionMenu' 
}, function(){}); 

我会继续搜索现在的问题。

---

UPDATE

我有固定的这个问题。如果将来有人遇到此问题，我更改了contextMenu插件以跳过其检查目标是否在“.department”类中。在“鼠标松开”功能之后，添加一个检查，检查事件目标，如下所示：

$(this).mouseup(function(e) { 
    if(!$(e.target).hasClass('department') && !$(e.target).parent().hasClass('department')) { 

Answer 1

你可以尝试添加延迟：500的排序参数列表，也许是延迟可能使双击泡泡正确吗？

同样，您可以使用距离：30，这将告诉排序不会开始工作，直到拖动持续30像素或更多。这可以用来确保'点击'事件的工作。