ScriptaculousのドラッグアンドドロップによるJavaScriptクリックイベントの防止

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

これは、enddragの後でもアクティブな残りのクリックイベントをキャッチして、元のハンドラーを再作成します。これが誰かに役立つことを願っています：）