Jquery/JS prevenir menú del botón derecho en los navegadores

tengo mi div con un menú del botón derecho emergente:Jquery/JS prevenir menú del botón derecho en los navegadores

// 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(); 

    } 
});

Pero el navegador para este elemento todavía aparece el menú por defecto (copiar/pegar/propiedades, etc.) . ¿Alguna forma de desactivar esto? He intentado devolver falso pero no suerte.

Fuente

2011-02-07 Tom Gullen

lo que es folderID, es este código en un bucle o ¿algo más? o tal vez necesita preventDefault()? –

Está en una función que crea una carpeta de forma dinámica. La ID de la carpeta es una ID única para la carpeta. –

Puede desactivar el clic derecho al agregar oncontextmenu = "return false;" a tu etiqueta corporal

<body oncontextmenu="return false;">

Fuente

2011-02-07 10:32:56 aruseni

No quiero deshabilitarlo para cada elemento, ya que será demasiado molesto para el usuario, solo los elementos que especifico es lo que quiero. –

+17

¿Intentó agregarlo al padre de fbox en lugar de body? – Shrinath

¡Excelente gracias! oncontextmenu = "return false;" asignado al div contenedor funcionó una delicia. –

// 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(); 

    } 
});

Fuente

2011-02-07 10:34:06 Shrinath

No tengo suerte, agrego esto después de que el div se haya agregado al DOM pero todavía muestra el menú –

¿le importa configurar un código de prueba en jsfiddle.net? – Shrinath

Prueba esto:

$('#fBox' + folderID).bind("contextmenu", function() { 
       alert("Right click not allowed"); 
       return false; 
      });

Fuente

2011-02-07 10:35:07

La alerta bloquea el menú, pero también bloquea la ejecución de todos los demás códigos –

Si desea que se ejecute el resto del código, utilice preventDefault() en lugar de devolver falso. Return false detiene toda la propagación del evento, pero preventDefault() detendrá el evento actual y continuará ejecutando el resto del código. –

Este es un comportamiento por defecto de los navegadores ahora para desactivar la anulación alternativo clic. Cada usuario tiene que permitir este comportamiento en los navegadores recientes. Por ejemplo, no permito este comportamiento ya que siempre quiero mi menú emergente predeterminado.

Fuente

2011-02-07 10:36:35

Trate ...

$('[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(); 

    } 
});

si tiene alguna creación dinámica de estas cajas luego ...

$('[id^="fBox"]').live('mousedown',function(event) { 
    ... 
});

Fuente

2011-02-07 10:42:28

Usando jQuery:

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

o deshabilitar menú contextual de toda la página:

$(document).bind("contextmenu",function(e){ 
    return false; 
});

línea

Fuente

2012-11-06 23:12:11 kachar

Una jQuery:

$('[id^="fBox"]').on("contextmenu", function(evt) {evt.preventDefault();});

Fuente

2013-05-09 14:10:44 KrisWebDev

estoy de acuerdo con @aruseni, bloqueando OnContextMenu a nivel del cuerpo evitará el menú contextual estándar en el botón derecho del ratón para cada elemento de la página.

¿Pero y si quieres tener un control más fino?

Tuve un problema similar y pensé que encontré una buena solución: ¿por qué no adjuntar directamente su código de menú contextual al evento contextmenu del elemento o elementos específicos que desea tratar? Algo como esto:

// 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 
});

este modo puede evitar el manejo de dos eventos diferentes sólo para capturar el menú contextual y personalizar él :)

Por supuesto, esto supone que no importa tener el menú contextual estándar aparece cuando alguien hace clic en los elementos que no seleccionaste. También podría mostrar diferentes menús contextuales dependiendo de dónde los usuarios hacen clic derecho.

HTH

Fuente

2013-06-18 15:51:19 Luke

buena idea para utilizar el evento "contextmenu" en lugar de tener que usar "mousedown" y luego identificar el clic derecho ... – lepe

Para mí

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

jQuery hace el trabajo :)

Fuente

2013-10-18 07:47:28

Puede desactivar menú contextual de cualquier elemento que desee:

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

Para desactivar el contexto menú en la página completamente (gracias a Ismail), use lo siguiente:

$(document).contextmenu(function() { 
    return false; 
});

Fuente

2014-01-07 13:31:21 Webars

* funcionó para toda la página, pero la opción del selector específico no. – Mych

Los selectores $ ('*') son muy usados $ (documento) – Ismail

Esta es una forma que utilicé recientemente (usando un poco de jQuery también) cuando me encontré con un problema. Dado que el evento mousedown ocurre antes del menú contextual, este truco parece atraparlo, lo cual es asociar un nivel corporal en el controlador de menú contextual para devolver el falso temporalmente en el evento mousedown, realizar la acción deseada, y luego como una parte importante, recuerde quitar el manejador después .

Esto es sólo parte de mi código extraído a cabo, como un ejemplo ...

$(div) 
    .mousedown(function (e) { 
     if (!leftButtonPressed(e)) { 
      disableContextMenu(true); 
      showOptions({ x: e.clientX, y: e.clientY }, div); // do my own thing here 
     } 
    });

Cuando mis showoptions() rtn acabados, una función de devolución de llamada se ejecuta y se llama al desactivar RTN de nuevo, pero con el 'falso':

disableContextMenu(false);

Aquí es mi disableContextMenu() RTN:

function disableContextMenu(boolDisable, fn) { 
    if (boolDisable) { 
     $(document).contextmenu(function (e) { 
      if (fn !== undefined) { 
       return fn(e); 
      } else { 
       return false; 
      } 
     }); 
    } else { 
     $(document).prop("oncontextmenu", null).off("contextmenu"); 
    } 
}

Fuente

2018-01-03 23:53:14

Jquery/JS prevenir menú del botón derecho en los navegadores

Respuesta

Cuestiones relacionadas