代码之家 › 专栏 › 技术社区 › digitalsanctum

使用Scriptaculous拖放防止JavaScript单击事件

scriptaculous drag-and-drop event-handling events javascript

4

digitalsanctum · 技术社区 · 17 年前

我在页面上有一些可以拖动的元素。这些相同的元素有一个可导航到另一个页面的单击事件。我试图确定,如果用户正在拖动,那么阻止单击事件触发的最佳方法,但如果不拖动,那么仍然允许单击事件。有人知道实现这一目标的最佳方法吗?

4 回复 | 直到 13 年前

1

digitalsanctum 17 年前

我使用如下方法解决了这个问题:

new Draggable('id', {
    onStart: function() {
        dPhoto = $('id');
        Event.stopObserving('id', 'click');
    },
    onEnd : function() {
        setTimeout("Event.observe('id', 'click', function() { location.href = 'url'; });", 500);
    },
    revert: true
});

2

1

Tony 17 年前

var click_func;
function onDragStart(drgObj,mouseEvent){
    click_func = mouseEvent.target.onclick;

    mouseEvent.target.onclick = function(e){
        mouseEvent.target.onclick = click_func;
        return false;
    }
}

3

0

VonC 17 年前

类似于以下的操作可能会起到作用(并防止触发单击事件)

new Draggable('tag',  
    {
        revert:function()
        {
            $('tag').onclick = function(){return false;};
            setTimeout('$(\'tag\').onclick = function(){return true;}','500');  
            return true;
        }
    }
);

4

0

sth 16 年前

你也可以用另一种方法。在你的星条旗上,你停止观察这个物体。然后再次观察单击,这将导致一个enddrag函数,该函数将重新创建第一个eventhandler。

function onDragStart() {
    Event.stopObserving(this.OBJECT,'click');
    Event.observe(this.OBJECT,'click',this.onDragEnd.bindAsEventListener(this));
}

function onDragEnd() {
    Event.stopObserving(this.OBJECT,'click');
    Event.observe(this.OBJECT,'click',this.PREVIOUSFUNCTION.bindAsEventListener(this));
}

这将捕获结束拖动后仍处于活动状态的剩余单击事件,以便重新创建原始处理程序。我希望这有助于其他人:)