当调用drop函数时,将其设置为droppable DOM节点(目标),ui.draggable是拖动的DOM节点.
(我正在使用jQuery模板,如果它很重要.可能有多个渲染的单个modelView对象.)
解决方法
可能有更好的方法来做到这一点,但我作弊.这是我的绑定.
编辑
由于下面的例子不完整,我做了一个简单的完整例子,可以在这里找到.
存储当前拖动元素的位置取决于您.在示例中,我使用全局变量作为viewmodel项的代理.您可以为每个draggables和droppables提供对其父模型的引用,并以这种方式访问该属性,这取决于您.
希望这可以帮助.
ko.bindingHandlers.drag = { init: function (element,valueAccessor,allBindingsAccessor,viewmodel) { var $element = $(element),dragOptions = { revert: 'invalid',revertDuration: 250,cancel: 'span.handle',cursorAt: { left: 28,bottom: 0 },appendTo : 'body',helper: function () { return $('<div class="drag-icon"><img src="images/folder-large.png" alt="move" width="32" height="32" /></div>'); },cursor: "pointer",addClasses: false,distance: 10,start : function (e,ui) { viewmodel.isDragging(); } }; $element.draggable(dragOptions); },update : function (element,active = valueAccessor(); if (!active) { $element.draggable('disable'); } else { $element.draggable('enable'); } } }; ko.bindingHandlers.drop = { init: function (element,value = valueAccessor() || {},handler = ko.utils.unwrapObservable(value.onDropComplete),dropOptions = { greedy: true,tolerance: 'pointer',drop: function (e,ui) { setTimeout(function () { handler(viewmodel.dragging()); },0); } }; $element.droppable(dropOptions); } };
所以我设置了draggable并在start函数中存储了当前拖动的节点viewmodel.isDragging();然后我可以在drop handler中再次访问它.
干杯,
伊恩
原文地址:https://www.jb51.cc/jquery/177185.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。