我想使用JS或jQuery使左键单击表现为右键单击

Question

I have been trying to trigger right click even when the users left click.

I have tried trigger, triggerHandler, mousedown but I wasn't able to get it to work.

I'm able to catch the click events themselves but not able to trigger the context menu.

Any ideas?

Answer 1

To trigger the mouse right click

function triggerRightClick(){
  var evt = new MouseEvent("mousedown", {
        view: window,
        bubbles: true,
        cancelable: true,
        clientX: 20,
        button: 2
    });
  some_div.dispatchEvent(evt);
}

To trigger the context menu

function triggerContextMenu(){
  var evt = new MouseEvent("contextmenu", {
        view: window
    });
  some_div.dispatchEvent(evt);
}

Here is the bin: http://jsbin.com/rimejisaxi

For better reference/explanation: https://stackoverflow.com/a/7914742/1957036

Answer 2

Use the following code for reversing mouse clicks.

$.extend($.ui.draggable.prototype, {
        _mouseInit: function () {
            var that = this;
            if (!this.options.mouseButton) {
                this.options.mouseButton = 1;
            }

            $.ui.mouse.prototype._mouseInit.apply(this, arguments);

            if (this.options.mouseButton === 3) {
                this.element.bind("contextmenu." + this.widgetName, function (event) {
                    if (true === $.data(event.target, that.widgetName + ".preventClickEvent")) {
                        $.removeData(event.target, that.widgetName + ".preventClickEvent");
                        event.stopImmediatePropagation();
                        return false;
                    }
                    event.preventDefault();
                    return false;
                });
            }

            this.started = false;
        },
        _mouseDown: function (event) {

            // we may have missed mouseup (out of window)
            (this._mouseStarted && this._mouseUp(event));

            this._mouseDownEvent = event;

            var that = this,
                btnIsLeft = (event.which === this.options.mouseButton),
                // event.target.nodeName works around a bug in IE 8 with
                // disabled inputs (#7620)
                elIsCancel = (typeof this.options.cancel === "string" && event.target.nodeName ? $(event.target).closest(this.options.cancel).length : false);
            if (!btnIsLeft || elIsCancel || !this._mouseCapture(event)) {
                return true;
            }

            this.mouseDelayMet = !this.options.delay;
            if (!this.mouseDelayMet) {
                this._mouseDelayTimer = setTimeout(function () {
                    that.mouseDelayMet = true;
                }, this.options.delay);
            }

            if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) {
                this._mouseStarted = (this._mouseStart(event) !== false);
                if (!this._mouseStarted) {
                    event.preventDefault();
                    return true;
                }
            }

            // Click event may never have fired (Gecko & Opera)
            if (true === $.data(event.target, this.widgetName + ".preventClickEvent")) {
                $.removeData(event.target, this.widgetName + ".preventClickEvent");
            }

            // these delegates are required to keep context
            this._mouseMoveDelegate = function (event) {
                return that._mouseMove(event);
            };
            this._mouseUpDelegate = function (event) {
                return that._mouseUp(event);
            };
            $(document)
                .bind("mousemove." + this.widgetName, this._mouseMoveDelegate)
                .bind("mouseup." + this.widgetName, this._mouseUpDelegate);

            event.preventDefault();

            mouseHandled = true;
            return true;
        }
    });

---

Now at the function calling event use mouseButton : 3 for right click and 1 for left click