Question

jQuery Sortable（）运行良好，如果我尝试销毁并创建可排序的，也运行良好。但是如果尝试$(document).unbind('mousemove')并重新创建可排序的，它只能工作一次然后再也无法工作。我知道我可以改变代码。但我想知道原因。

这里是下面的代码，也是jsfiddle（http://jsfiddle.net/webjjin/YJEf5/）

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<div id="container"> 
<ul id="sortable">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
</ul>
</div>
<button id="btn">Destroy and create</button>
<button id="unbind">Unbind</button>

<script>$("#sortable").sortable();</script>
<script>
var html = $('#container').html();
$('#btn').click(function(){
    $("#sortable").sortable('destroy');
    $('#container').empty();
    setTimeout(function(){
        $('#container').append(html);

        $("#sortable").sortable();
    }, 500);
});
$('#unbind').click(function(){
    jQuery(document).unbind('mousemove').unbind('mouseup');
})
</script>

Answer 1

使用此代码，

jQuery(document).unbind('mousemove').unbind('mouseup');

您要删除页面上所有 mousemove和mouseup事件侦听器，这对 jQuery sortable 至关重要。它用于跟踪拖动元素悬停或掉落的位置等功能。所以取消绑定会破坏整个过程。

如果要取消绑定这些事件监视器，请使用特定的选择器：

$('#test').unbind('mousemove').unbind('mouseup');

Answer 2

最后我找到了原因。

在jQuery-ui文件中。有这个代码。

var mouseHandled = false;
$( document ).mouseup( function() {
mouseHandled = false;
});

和_mouseDown函数检查如下，

if( mouseHandled ) { return; }

这就是为什么如果尝试jQuery（document）.unbind（'mouseup'），可排序小部件不起作用包括其他jquery-ui小部件。

谢谢大家。

jQuery sortable（）在$（document）之后无效.unbind（'mousemove'）

2 个答案: