Javascript Raphael.js的鼠标事件由任何鼠标按钮触发

Javascript Raphael.js的鼠标事件由任何鼠标按钮触发,javascript,Javascript,我使用raphael.js在一张“纸”中操纵图像。我已经意识到所有鼠标事件(点击、鼠标下降、鼠标点击、拖动启动…)都是由任何鼠标按钮触发的 在本例中,有一个拖动两个对象的示例,可以使用鼠标左键、右键或中键拖动它们 JSFiddle 如何根据单击的按钮筛选事件?例如,我只想用鼠标左键拖动 我在另一篇StackOverflow文章中读到,可以用e来识别鼠标按钮,它将根据按下的按钮返回1、2或3,但我找不到使用此变量过滤事件触发器的方法 我已经找到了一个关于这个问题的解决方案,但它自2012年以来一

我使用raphael.js在一张“纸”中操纵图像。我已经意识到所有鼠标事件(点击、鼠标下降、鼠标点击、拖动启动…)都是由任何鼠标按钮触发的

在本例中,有一个拖动两个对象的示例,可以使用鼠标左键、右键或中键拖动它们

JSFiddle
如何根据单击的按钮筛选事件?例如,我只想用鼠标左键拖动

我在另一篇StackOverflow文章中读到,可以用e来识别鼠标按钮,它将根据按下的按钮返回1、2或3,但我找不到使用此变量过滤事件触发器的方法

我已经找到了一个关于这个问题的解决方案,但它自2012年以来一直是开放的。我尝试使用部分代码用if(e.which==1)过滤鼠标按钮,然后创建了一个控制台条目。通过这种方式,控制台条目仅在我尝试使用左按钮进行拖动时出现,而不会在其他按钮中出现。我还没有找到实现其余代码的方法

有人知道什么是g.doc.documentElement或g.doc.body(从bug报告代码中)吗

提前感谢您的支持


祝您玩得愉快

我找到了一种方法,我没有使用npm安装raphael来安装raphael,而是从github下载了js文件,然后用以下方式编辑了拖动功能:

elproto.drag = function (onmove, onstart, onend, move_scope, start_scope, end_scope) {
        function start(e) {
            if (e.which == 1) {
                (e.originalEvent || e).preventDefault();
                var x = e.clientX,
                    y = e.clientY,
                    scrollY = g.doc.documentElement.scrollTop || g.doc.body.scrollTop,
                    scrollX = g.doc.documentElement.scrollLeft || g.doc.body.scrollLeft;
                this._drag.id = e.identifier;
                if (supportsTouch && e.touches) {
                    var i = e.touches.length, touch;
                    while (i--) {
                        touch = e.touches[i];
                        this._drag.id = touch.identifier;
                        if (touch.identifier == this._drag.id) {
                            x = touch.clientX;
                            y = touch.clientY;
                            break;
                        }
                    }
                }
                this._drag.x = x + scrollX;
                this._drag.y = y + scrollY;
                !drag.length && R.mousemove(dragMove).mouseup(dragUp);
                drag.push({el: this, move_scope: move_scope, start_scope: start_scope, end_scope: end_scope});
                onstart && eve.on("raphael.drag.start." + this.id, onstart);
                onmove && eve.on("raphael.drag.move." + this.id, onmove);
                onend && eve.on("raphael.drag.end." + this.id, onend);
                eve("raphael.drag.start." + this.id, start_scope || move_scope || this, this._drag.x, this._drag.y, e);
            }
        }
        this._drag = {};
        draggable.push({el: this, start: start});
        this.mousedown(start);
        return this;
    };

这很好,我必须对每个鼠标事件执行相同的操作,但我认为这些信息对其他人会有帮助。

我找到了一种方法来执行此操作,而不是使用npm安装raphael安装raphael,我从github下载了js文件,然后用以下方式编辑了拖动功能:

elproto.drag = function (onmove, onstart, onend, move_scope, start_scope, end_scope) {
        function start(e) {
            if (e.which == 1) {
                (e.originalEvent || e).preventDefault();
                var x = e.clientX,
                    y = e.clientY,
                    scrollY = g.doc.documentElement.scrollTop || g.doc.body.scrollTop,
                    scrollX = g.doc.documentElement.scrollLeft || g.doc.body.scrollLeft;
                this._drag.id = e.identifier;
                if (supportsTouch && e.touches) {
                    var i = e.touches.length, touch;
                    while (i--) {
                        touch = e.touches[i];
                        this._drag.id = touch.identifier;
                        if (touch.identifier == this._drag.id) {
                            x = touch.clientX;
                            y = touch.clientY;
                            break;
                        }
                    }
                }
                this._drag.x = x + scrollX;
                this._drag.y = y + scrollY;
                !drag.length && R.mousemove(dragMove).mouseup(dragUp);
                drag.push({el: this, move_scope: move_scope, start_scope: start_scope, end_scope: end_scope});
                onstart && eve.on("raphael.drag.start." + this.id, onstart);
                onmove && eve.on("raphael.drag.move." + this.id, onmove);
                onend && eve.on("raphael.drag.end." + this.id, onend);
                eve("raphael.drag.start." + this.id, start_scope || move_scope || this, this._drag.x, this._drag.y, e);
            }
        }
        this._drag = {};
        draggable.push({el: this, start: start});
        this.mousedown(start);
        return this;
    };
这很好,我必须为每个鼠标事件做同样的事情,但我认为这些信息对其他人会有帮助