0

这是我的自定义函数，称为“doIt”，我确信您可以看到它只是允许某人在类或 id 上调用 .doIt()，在这种情况下，使背景颜色变为红色，然后使元素可拖动。（这是我的第一次尝试，所以请善待）。

(function($) {
   $.fn.doIt = function(customOptions) {
      var options = $.extend({}, $.fn.doIt.defaultOptions, customOptions);
      return this.each(function() {
         var $this = $(this); 
         $this.on('click', function(e){
            e.preventDefault();
            $this.css("background-color", options.color);
            $this.draggable();
         });
      });
   };
   $.fn.doIt.defaultOptions = {
    color: "#000"   
   };               
})(jQuery);

因为我的函数使元素可拖动，所以我想使用一些与可拖动相关的事件，例如“停止”，所以当拖动停止时，我希望用户能够在回调中访问相同的事件/ui 信息停止。

但是，我如何与函数中可拖动的停止事件进行交互？

我期待看到的是这样的：

$("div#test").doIt({
    color: "#ffeeaa",
    stop: function(e, ui){

      //interact with draggable event/ui here.  
      //So 'e' and 'ui' would return me what the 'stop' event from draggable would normall return.

    }
});

这是可能的还是我吠错了树？

4

1 回答 1

1

您只需要将您的选项传递给 jQuery。显然，您定义的选项超出了 jQuery 使用的范围，因此您可能想要过滤掉 jQuery 不关心的选项，但我很确定您不必这样做；jQuery 只会忽略它不使用的属性。

因此，您正在专门尝试参与该stop事件。为此，请更改此行：

$this.draggable();

对此：

$this.draggable({
    stop: customOptions.stop   // Get the callback defined in custom options
});

如果您的自定义选项和 jQuery 定义的选项之间没有任何命名冲突，您可以这样做：

$this.draggable(customOptions);

一旦用户停止拖动您的可拖动元素，jQuery 将调用您的函数（将event和参数传递给它）。ui

于 2012-06-25T16:34:59.867 回答