Question

我在页面上有一些可拖动的元素。这些相同的元素具有导航到另一页面的单击事件。我试图确定阻止点击事件的最佳方法，如果用户正在拖动但仍然允许点击事件，如果不拖动。任何人都有最好的方法来实现这个目标吗？

Answer 1

我通过使用以下内容解决了这个问题：

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
});

Answer 2

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

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

Answer 3

以下内容可能会起作用（并防止点击事件被触发）

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

Answer 4

你也可以用另一种方式做到这一点。在startDrag上，您将停止观察对象。然后再次观察点击，这会导致enddrag函数重新创建第一个事件处理程序。

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));
}

这将捕获剩余的click事件，该事件在enddrag之后仍然处于活动状态，只是重新创建原始处理程序。我希望这能帮助那些人：）

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

4 个答案: