Question

直到最近，我才进行了此次设置，多次调用：

                $('.rsh')
                    .draggable('destroy')                               
                    .draggable({ blah blah details });

destroy可以阻止多个可拖动的处理程序在类上累积。 AJAX正在创建新元素，draggable与类的初始附件不会触及随后创建的元素。

然而，当我更新到jQuery UI的1.9.2版时，它开始给我这个错误：

错误：在初始化之前无法调用draggable上的方法;试图调用方法'destroy'

所以我删除了破坏线，它很甜。除了......我怀疑我现在可能会在课堂上添加越来越多的处理程序（这就是destroy首先出现的原因）。

我试过这个，但它不喜欢它：

if ($('.rsh').length) {
    $('.rsh').draggable('destroy'); 
}

两个问题：（1）每次开启可拖动的设置线时，是否会有越来越多的处理程序附加到班级？（2）如果是这样，有关如何删除它们的任何解决方案？

Answer 1

不，不会有额外的处理程序限制。 jQuery将初始化的实例注册到元素，并且不会为同一元素创建同一小部件的新实例。

当你担心处理程序时，这里有一个快速检查（jQuery 1.8+和UI 1.9 +）：

$('div').draggable();
console.log( $._data($('div')[0], 'events') );
$('div').draggable();
console.log( $._data($('div')[0], 'events') );

Fiddle

如您所见，在尝试初始化同一元素上的新可拖动实例后，附加的处理程序对象不会被更改。

编辑：不会忽略带参数的后续调用，而是扩展现有的小部件，如@Jason Sperske的答案所示。

Answer 2

对.draggable()的后续调用在附加到同一对象时会扩展先前的调用（而不是像我原先想象的那样替换它们）。看这个例子（从FabrícioMatté扩展）（demo）

<div>foo</div>
<script>
 $('div').draggable({
  start: function () {
    console.log("drag 1");
  }
 });
 console.log($._data($('div')[0], 'events'));
 $('div').draggable({
  stop: function () {
    console.log("drag 2");
  }
 });
 console.log($._data($('div')[0], 'events'));
</script>

在console.log中，您只会看到以下消息：

drag 1 <- on start
drag 2 <- on stop

jQuery draggable - 如果对元素应用两次会发生什么？

2 个答案: