Я новичок в jQuery.Я пытаюсь решить проблему с JQuery.
У разрабатываемого мною приложения есть Canvas, и я хочу отфильтровать входящие в него события.
Я попытался сделать это, поместив тег div на холст.Если событие разрешено, активируйте его на холсте.
#overlay {
position: fixed; /* Sit on top of the page content */
display: block; /* Hidden by default */
width: 100%; /* Full width (cover the whole page) */
height: 100%; /* Full height (cover the whole page) */
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,0.5); /* Black background with opacity */
z-index: 200;
}
<div id="overlay"> </div>
<canvas id="GameCanvas" oncontextmenu="event.preventDefault()" tabindex="0"></canvas>
События, которые я хочу предотвратить, это F11 (полноэкранный режим) и Zoom.Я не хочу, чтобы они обрабатывались холстом, потому что они не работают, если холст начинает его обрабатывать.Они должны обрабатываться веб-страницей.
Я заставил их обоих работать, записывая события клавиатуры
$(document).on(
{
keydown:eventKey,
keyup:eventKey,
});
function eventKey(e)
{
if (!
(
// don't allow zoom with ctrl +/-
((e.which == 107 || e.which == 109 || e.which == 96) && e.ctrlKey)
||
// F11 fullscreen
(e.which == 122)
)
)
{
// don't allow zoom with ctrl +/-
$("GameCanvas").trigger(e);
}
}
У меня проблема в том, что я не знаю, как обрабатывать события мыши,Я хочу, чтобы холст не обрабатывал Ctrl + прокрутка мыши (увеличение) и позволял ему обрабатывать все остальные события.
Я запускаю такие события
$(document).on(
{
mousedown:mouseEvent,
mouseup:mouseEvent,
click:mouseEvent,
});
function mouseEvent(e)
{
$('GameCanvas').trigger(e);
}
Но по какой-то причине холст делаеткажется, не получает события.
Может кто-нибудь объяснить, как это сделать?
Или есть лучший способ справиться с этим?