jquery - 如何数据绑定(bind).ressized().draggable()？

Question

我知道你可以做到这一点:

$(".myClass").resizable().draggable();

但是如何使用 data-bind="" 来做同样的事情呢？

Answer 1

最简单的方法是为行为定义自定义绑定(bind)处理程序:

ko.bindingHandlers.resizable = {
    init: function(element, valueAccessor) {
         var options = valueAccessor();
         $(element).resizable(options);
    }  
};

ko.bindingHandlers.draggable = {
    init: function(element, valueAccessor) {
         var options = valueAccessor();
         $(element).draggable(options);
    }  
};

然后，像这样绑定(bind)它:

<div data-bind="resizable: { }, draggable: { }"></div>

这允许您将所需的任何选项传递给可调整大小和可拖动的调用。

示例:http://jsfiddle.net/rniemeyer/eCZH4/