javascript - 道场可移动事件？

Question

我正在阅读此处的文档 http://bill.dojotoolkit.org/api/1.9/dojo/dnd/move.parentConstrainedMoveable在这里 http://dojotoolkit.org/reference-guide/1.9/dojo/dnd/Moveable.html以及在网络上找到的一些示例，但我似乎不明白如何使其工作。我有这个 fiddle http://jsfiddle.net/W7V2a/4/我希望在移动开始之前调用一个函数，在移动期间调用另一个函数，一旦结束则​​调用第三个函数。不仅一次，而是每次发生移动时。我无法让它捕捉到事件。

此外，按钮将一直添加和删除，因此将可移动对象附加到像这样的变量

var moveable = new move.parentConstrainedMoveable(button.domNode, {
        handle: this.focusNode,
        area: "content",
        within: true
    });

    on(moveable, "onMoveStart", function (e) {
        dojo.query(".container").style("backgroundColor", "red");
        alert("onMoveStart");
    });

看起来不太实用。那么我如何动态创建可移动对象并捕获它们的事件并处理这些事件？

Answer 1

当您使用 dojo/on 模块时，您只需传递事件的名称。在您的情况下，您必须将 "onMove" 替换为 "Move" 并将 "onMoveStart" 替换为 "MoveStart" >，像这样:

on(moveable, "MoveStart", function (e) {
    dojo.query(".container").style("backgroundColor", "red");
    alert("onMoveStart");
});

on(moveable, "Move", function (e) {
    dojo.query(".container").style("backgroundColor", "red");
    alert("onMove");
});

我还更新了您的 JSFiddle:http://jsfiddle.net/W7V2a/8/ (尽管我不建议使用alert())。

<小时/>

如果您直接使用函数本身，则只需使用全名。例如，如果您使用 dojo/aspect 模块，则必须使用:

aspect.after(moveable, "onMove", function(e) {
    dojo.query(".container").style("backgroundColor", "red");
    alert("onMove");
});

<小时/>

但是，dojo/on 通常仅用于 DOM 事件处理，而不用于自定义事件。使用这些事件的最佳方法是使用 on() moveable 本身的函数，例如:

moveable.on("Move", function (e) {
   dojo.query(".container").style("backgroundColor", "red");
   alert("onMove");
});