Javascript 如何使jQueryUI小部件可拖动

我需要澄清一些jQueryUI的概念，并且需要您的帮助

如果我这样做：

$("<div></div>").draggable();

我想接下来会是一团糟。在任何情况下，我都想为drag方法定义属性，所以我想把它放在我的小部件中。因此，第二个问题是：如何扩展$.ui.draggable？你有什么好的教程吗？简单地说这似乎还不够：

$.widget( "namespace.mywidget", $.ui.draggable, {} );

---

谢谢大家的宝贵意见

只需将其包含在插件中即可。确保在插件代码之前包含jqueryUI

(function($){
    $.fn.myWidget = function(){
        return this.each(function(){
            $(this).draggable();
        });

    };
})(jQuery)

$('<div></div>').myWidget();  // this should be draggable.

（函数（$）{
$.fn.myWidget=function（）{
返回此值。每个（函数（）{
$（this.draggable（）；
});
};
})（jQuery）
$（''）.myWidget（）；//这应该是拖拉的。

---

在使用DragTable之前，请确保元素位于DOM中：

$('<div></div>').appendTo(document.body)

$（''）.appendTo（document.body）

然后，您可以将小部件和Dragable链接在一起：

   $('<div></div>').appendTo(document.body)
     .mywidget()
     .draggable();

$（''）.appendTo（document.body）
.mywidget（）
.draggable（）；

---

您可以在每个小部件调用中设置任何想要的参数。我在上创建了一个示例，它构建了一个简单的自定义UI小部件作为参考和演示用途。

我认为这行不通。其效果与在插件之外执行

$（''）.draggable（）

没有什么不同。谢谢Julian，不过我不确定我是否了解你。也许你想在_create函数中运行它？它将做与在插件外部调用它相同的事情。这是真的。但我认为这样做的目的是不必在插件之外调用draggable。此外，widget工厂执行与上面的笨拙代码相同的操作。它使插件的执行方式更加标准（有好有坏）。我从来没有真正使用过widget（），但_create函数听起来像是调用Dragable的地方。@JulianRaya是的，我想如果这是必需的，那么这可能会起作用。不过，最好在

\u create

中执行此操作。@JulianRaya我是否正确理解您的意思，这将使我的小部件中的每个字段都“可拖动”？。调用

this.element.draggable（）不是更好吗在构造函数内部？在任何情况下，我的问题是，如果元素是可拖动的，当我在可拖放中捕获它时，它包含元素本身（例如div），但不包含我正在使用的小部件。当您尝试扩展
$.ui.draggable
？@Alnitak时会发生什么。我想我需要调用“超类”构造函数，但我不知道如何引用它。。。
   $('<div></div>').appendTo(document.body)
     .mywidget()
     .draggable();