Jquery / JS предотвращают щелчок правой кнопкой мыши в браузерах - PullRequest
Новая
       8

Jquery / JS предотвращают щелчок правой кнопкой мыши в браузерах

48 голосов
/ 07 февраля 2011

У меня есть div с всплывающим меню правой кнопкой мыши: 

// Attatch right click event to folder for extra options
$('#fBox' + folderID).mousedown(function(event) {
    if (event.which == 3) {

        // Set ID
        currRClickFolder = folderID;

        // Calculate position to show popup menu
        var height = $('#folderRClickMenu').height();
        var width = $('#folderRClickMenu').width();
        leftVal = event.pageX - (width / 2) + "px";
        topVal = event.pageY - (height) + "px";
        $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

    }
});

Но в браузере для этого элемента все еще появляется меню по умолчанию (копировать / вставить / свойства и т. Д.).Есть ли способ отключить это?Я пытался вернуть ложь, но не удачу.

Ответы [ 11 ]

104 голосов
/ 07 февраля 2011

Вы можете отключить правый клик, добавив oncontextmenu = "return false;" на тэг вашего тела. 

<body oncontextmenu="return false;">
42 голосов
/ 07 января 2014

Вы можете отключить контекстное меню для любого элемента: 

$('selector').contextmenu(function() {
    return false;
});

Чтобы полностью отключить контекстное меню на странице (благодаря Ismail), используйте следующее: 

$(document).contextmenu(function() {
    return false;
});
13 голосов
/ 09 мая 2013

Одна строка jQuery: 

$('[id^="fBox"]').on("contextmenu", function(evt) {evt.preventDefault();});
8 голосов
/ 07 февраля 2011

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

$('#fBox' + folderID).bind("contextmenu", function () {
                alert("Right click not allowed");
                return false;
            });
3 голосов
/ 07 февраля 2011

Try ... 

$('[id^="fBox"]').mousedown(function(event) {
    if (event.which == 3) {
        event.preventDefault();
        // Set ID
        currRClickFolder = $(this).attr('id').replace('fBox','');

        // Calculate position to show popup menu
        var height = $('#folderRClickMenu').height();
        var width = $('#folderRClickMenu').width();
        leftVal = event.pageX - (width / 2) + "px";
        topVal = event.pageY - (height) + "px";
        $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

    }
});

если у вас есть динамическое создание этих блоков, то ... 

$('[id^="fBox"]').live('mousedown',function(event) {
    ...
});
2 голосов
/ 18 июня 2013

Я согласен с @aruseni, блокируя oncontextmenu на уровне тела, вы избежите стандартного контекстного меню, вызываемого правой кнопкой мыши для каждого элемента на странице.

Но что, если вы хотите иметь более точный контроль?

У меня была похожая проблема, и я подумал, что нашел хорошее решение: почему бы не присоединить непосредственно код вашего контекстного меню к событию contextmenu конкретного элемента (элементов), с которым вы хотите работать? Как то так: 

// Attatch right click event to folder for extra options
$('#fBox' + folderID).on("contextmenu", function(event) {
  // <-- here you handle your custom context menu
  // Set ID
  currRClickFolder = folderID;

  // Calculate position to show popup menu
  var height = $('#folderRClickMenu').height();
  var width = $('#folderRClickMenu').width();
  leftVal = event.pageX - (width / 2) + "px";
  topVal = event.pageY - (height) + "px";
  $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

  event.stopImmediatePropagation();
  return false; // <-- here you avoid the default context menu
});

Таким образом, вы избегаете обработки двух разных событий просто для того, чтобы захватить контекстное меню и настроить его:)

Конечно, это предполагает, что вы не возражаете против отображения стандартного контекстного меню, когда кто-то щелкает элементы, которые вы не выбрали. Вы также можете отобразить различные контекстные меню в зависимости от того, где пользователи щелкнули правой кнопкой мыши.

НТН

2 голосов
/ 07 ноября 2012

Использование jQuery: 

$('[id^="fBox"]').bind("contextmenu",function(e){
    return false;
});

Или отключить контекстное меню на всей странице: 

$(document).bind("contextmenu",function(e){
    return false;
});
2 голосов
/ 07 февраля 2011

Это поведение браузеров по умолчанию, теперь отключающее переопределение альтернативным щелчком.Каждый пользователь должен разрешить такое поведение в последних браузерах.Например, я не разрешаю такое поведение, поскольку всегда хочу всплывающее меню по умолчанию.

1 голос
/ 18 октября 2013

для меня 

$('body').on('contextmenu',function(){return false;});

jQuery делает работу:)

1 голос
/ 07 февраля 2011 
// Attatch right click event to folder for extra options
$('#fBox' + folderID).mousedown(function(event) {
    if (event.which == 3) {
        event.preventDefault();
        // Set ID
        currRClickFolder = folderID;

        // Calculate position to show popup menu
        var height = $('#folderRClickMenu').height();
        var width = $('#folderRClickMenu').width();
        leftVal = event.pageX - (width / 2) + "px";
        topVal = event.pageY - (height) + "px";
        $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

    }
});
Страница:
...