Я использую холст с HTML для рисования на экране. Мне нужно рисовать только левой кнопкой, а правой - ничего не делать. Я попробовал следующее:

canvas.oncontextmenu = e => {
    e.preventDefault();
    e.stopPropagation();
}

Это отключило меню правой кнопки мыши, но я могу нажать на холст (и в конечном итоге нарисовать на нем) как левой, так и правой кнопкой мыши. Что мне не хватает?

3
user12267069 24 Окт 2019 в 10:44

5 ответов

Лучший ответ

Пытаться:

<canvas oncontextmenu="return false;"></canvas>
2
TheCondorIV 24 Окт 2019 в 07:45

Попробуй это:

canvas.addEventListener('mousedown', (event) => {
  if (event.which !== 1) {
    event.preventDefault();
  }
});

Также следует отключить контекстное меню. Нажатие средней кнопки мыши тоже не даст никакого эффекта.

event.which содержит индекс нажатой кнопки мыши. 1 - левая кнопка, 2 - середина, 3 - правая. preventDefault() предотвращает выполнение браузера по умолчанию (например, открытие контекстного меню и т. Д., Его можно применять во многих ситуациях).

Кстати, stopPropagation() используется, чтобы остановить выполнение таких событий (в данном случае, как открытие контекстного меню) в дочерних элементах . <canvas> не имеет дочерних тегов, поэтому его можно опустить.

0
Andrey Kostenko 24 Окт 2019 в 07:57

Использование Jquery .

$('body').on('contextmenu', '#myCanvas', function(e){ return false; });
1
TheCondorIV 26 Окт 2019 в 05:03

Попробуйте следующее:

const canvas = document.getElementById('myCanvas');
canvas.oncontextmenu = () => false;

Где myCanvas в конечном итоге является идентификатором, присвоенным холсту, т.е.

<canvas id="myCanvas"></canvas>
0
user12267439user12267439 24 Окт 2019 в 07:56

Вы можете использовать это:

canvas.bind('contextmenu', function(e){
    return false;
}); 
2
user12267581user12267581 24 Окт 2019 в 08:23
58536501