1

https://jsfiddle.net/coolerprinter/xg10vzeL/

Как открыть свое контекстное меню там, где находится курсор мыши? К примеру, такой код не работает:

$("body").on("contextmenu", function(e){
     var x = function(e) { return e.pageX };
     var y = function(e) { return e.pageY };
  $(".contextmenu").css({
      "left": x,
      "top": y,
      "display":"block"
});
     return false;
 }); 
5
  • Во-первых потому, что в функции нет принимающего параметра e. Должно быть ` function(e){` а во вторых, если нет элементов на странице, то, возможно, высота body будет нулевая.... и конечно никуда не попадете... да еще и return e.pageX не в том контексте 29 янв 2016 в 15:36
  • Забыл параметр е написать. BODY не пустой. 29 янв 2016 в 15:40
  • BODY не пустой..... и есть гарантия? Ну тогда логично что e.pageX не к той функции относится, правда? jsfiddle.net/zfsc0prb/2 29 янв 2016 в 15:46
  • Спасибо! Обьясните, пожалуйста, почему 1 способ не работает? 29 янв 2016 в 15:51
  • 1 способ это какой? Ваш? Потому, что у вас x и y, по сути - вы пока объявили функции (а не поля или свойства), принимающие один параметр на вход. Это только объявление.. а надо их вызывать.. так: x() или y() ...передав на вход параметр... то есть x(e) или y(e)...Поэтому вот это function(e) { return e.pageX } по факту это вы не передаете переменную внешнюю, а просто объявили функцию, которая будет принимать на вход параметр с именем e ...использовать в вашем случае можно вот так: var x = function(e) { return e.pageX }(e); с игриком также ... это 3 способ 29 янв 2016 в 16:19

1 ответ 1

4

Прежде всего, Ваш jsfiddle не работает, потому что не загружен jQuery. Щелкните на Javascript в правом верхнем углу скриптового участка и выберите какую-нибудь версию jQuery.

Следующая проблема, как уже объяснил Алексей Шиманский, - это путаница с параметрами функций, присвоенных переменным x и y. Как указано в http://api.jquery.com/css/#css-propertyName-function, параметрами в эти функции будут поданы порядковый номер DOM элемента в наборе элементов, определенных селектором (в данном случае - ".contextmenu"), и старое значение свойства css. Контекст this - сам DOM элемент. Так как эти параметры Вы не используете, их можно не указывать.

Ну и чтобы обработчик contextmenu вызывался при щелчке в любом месте страницы, используйте html вместо body.

$("html").contextmenu(function(e){
  var x = function(index, value) { return e.pageX };
  var y = function(index, value) { return e.pageY };
  $(".contextmenu").css({
    "left": x,
    "top": y,
    "display":"block"
  });
  return false;
}); 

https://jsfiddle.net/xg10vzeL/6/

Более простой вариант, где значения left и top назначаются без использования функций:

$("html").contextmenu(function(e){
  $(".contextmenu").css({
    "left": e.pageX,
    "top": e.pageY,
    "display":"block"
  });
  return false;
}); 
0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.