如何使用dojo Moveable事件?

时间:2014-04-13 11:13:36

标签: javascript javascript-events dojo

我正在阅读此处的文档http://bill.dojotoolkit.org/api/1.9/dojo/dnd/move.parentConstrainedMoveablehttp://dojotoolkit.org/reference-guide/1.9/dojo/dnd/Moveable.html以及网络上发现的一些示例,但我似乎并不了解如何使其发挥作用。我有这个小提琴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");
    });

似乎不实用。那么我怎样才能动态创建可移动的对象并捕捉它们的事件并对这些事件做些什么呢?

1 个答案:

答案 0 :(得分: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事件处理,而不用于自定义事件。使用这些事件的最佳方法是使用moveable本身的on()函数,例如:

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