Запретить контекстное меню по умолчанию в кинетическом JS-шаге rightclick?

Question

Мне нужно отключить контекстное меню в кинетических js при нажатии на сцену. Я попробовал все, как event.preventDefault(), cancelbubble, event.stopPropagation() return false, но ничего не работает ..

Вот пример в jsfiddle .. Wat изменение должно быть сделано, чтобы предотвратить контекстное меню по умолчанию отображать

stage.on('click',stageClicked,true); 
function stageClicked(event){ 
    if(event.button==2){ 
     event.cancelBubble = true; 
     event.preventDefault(); 
      event.stopPropagation(); 

     return false; 
    } 
} 

http://jsfiddle.net/xPbgf/

Answer 1

выше ответ удаляет контекстное меню, но не позволяет @ user2045685 выбрать event.targetNode на правой кнопке мыши.

@ user2045685 государств в своих комментариях, что он нашел обходной путь, используя метод getAllIntersection, но я призывает не использовать эту альтернативу, как это не то, что она была предназначена для, метода getAllIntersection имеет очень плохой производительности , а использование event.targetNode работает просто отлично.

getAllIntersections (Pos)

получить все формы, которые пересекают точку. Примечание: поскольку этот метод должен очищать временную шкалу и перерисовывать каждую форму внутри контейнера, ее следует использовать только для особых ситуаций, потому что он работает очень плохо. Пожалуйста, используйте метод Kinetic.Stage # getIntersection если вообще possiblebecause он выполняет гораздо лучше

Источник: Kinetic.Container#getAllIntersections

Вместо этого, вы можете связать слушатель событий для вашего div#container и вызвать event.preventDefault() отключить контекстное меню ,

document.getElementById("container").addEventListener('contextmenu', function (event) { 
    event.preventDefault(); 
}); 

Вы также должны добавить «фоновый прямоугольник» с шириной и высотой вашей сцены, так что слой может обнаружить ваши клики. Вот почему в ответе @Brandon Boone выше он заявил, что «on, похоже, ничего не делает». для сцены. KineticJS ожидает, что узел будет прослушивать события, поэтому, если вы не добавите «прозрачный фон», тогда stage.on("click") будет срабатывать только тогда, когда вы щелкните правой кнопкой мыши по зеленому прямоугольнику (но не на остальной части сцены).

var bg = new Kinetic.Rect({ 
    width: stage.getWidth(), 
    height: stage.getHeight() 
}); 

// add bg first as your transparent background 
layer.add(bg); 
// add the shape to the layer 
layer.add(rect); 

Теперь вы можете использовать функцию stage.on('click', stgClicked) без проблем и вызвать event.targetNode внутри stgClicked функции.

function stgClicked(event) { 
    if (event.button == 2) { 
    alert('rightclick'); 
    var node = event.targetNode; 
    console.log(node); 
    } 
} 

JSfiddle

Answer 2

Похоже, вам нужно найти ссылку на холст в объекте сцены и приложить к ней contextmenu событие, так как передача его в on ничего не делает.

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

Live Demo

var canvas = stage.content.childNodes[0]; 
if (canvas.addEventListener) { 
    canvas.addEventListener('contextmenu', stgClicked, false); 
} else if (canvas.attachEvent) { 
    canvas.attachEvent('oncontextmenu', stgClicked); 
} 

---

Если вы хотите targetNode, просто проверить для него в родном случае JavaScript.

function stgClicked(event){ 
    var targetNode; 
    if (event.srcElement) targetNode = event.srcElement; 
    else if (event.target) targetNode = event.target; 

    alert(targetNode.nodeName); 
}