Desactivar botón derecho del ratón en un elemento del DOM

Si queremos que cierto elemento del DOM tenga desactivado el menú del botón derecho por defecto para lanzar nuestro propio evento, podemos hacerlo con el siguiente código:

$('.elemento').bind('contextmenu', function(e) {
    return false;
}); 

Para lanzar el evento que queramos, debemos de capturarlo con «which» mediante:

if (e.which == 3) {
	alert('Has pulsado el botón derecho (:');
}

Con lo que, incorporado a la función anterior quedaría así:

$('.elemento').bind('contextmenu', function(e) {
	if (e.which == 3) {
        alert('Has pulsado el botón derecho (:');
    }
	return false;
}); 

También podríamos hacerlo con:

$('.elemento').contextmenu(function() {
    // Aquí lanzamos los eventos que queramos
    return false;
});

Si queremos que se produzca en todo el documento (Apuntamos al documento «$(document)«) y no bloquear la acción de bloquear el menu por defecto (quitamos «return false;«):

$(document).bind('contextmenu', function(e) {
	if (e.which == 3) {
        alert('Has pulsado el botón derecho (:');
    }
}); 

Con las últimas librerías de jQuery también podemos:

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

Tu opinión es importante para mi, ¿Te ha resultado útil este artículo?

¿Eres programador/a?

En Pulpo están buscando nuevos talentos, envíales un email a developers@pulpoapp.com.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*