Como desabilito o botão direito do mouse na minha página da web?

316

Posso desativar o botão direito do mouse na minha página da Web sem usar JavaScript? Eu pergunto isso porque a maioria dos navegadores permite ao usuário desativar o JavaScript.

Caso contrário, como uso o JavaScript para desativar o botão direito?

javascript

— Vinay Pandey
fonte

130

Desabilitar o clique direito não é segurança, é apenas irritar seus usuários. Qualquer navegador que não permita que você desabilite isso é inútil, mas os sites que fazem isso em primeiro lugar são terríveis.

— 11119 Dan Olson

17

Se você não deseja que seu conteúdo seja levado, não deve publicá-lo na web. :) Os navegadores modernos podem até substituir a capacidade do JavaScript de desativar o botão direito. Ferramentas como Firebug / Web Dev Toolbar tornam a proteção inútil.

— epascarello

7

aqui é um script de usuário pequena cromo / greesemonkey para reativar o botão direito: dl.dropbox.com/u/464119/Programming/javascript/...

— ripper234

31

Realmente @DanOlson ... o que você deve fazer se quiser codificar seu próprio menu de atalho? Como o encontrado no cPanel.

— CodeSmith

30

@epascarello há certos casos que a desativação do botão direito é essencial, como em terminais de quiosques, bceause usuário faz realmente não precisa dele lá e deixá-lo lá pode realmente incomodar os usuários

— Aram

525

Você pode fazer isso com JavaScript adicionando um ouvinte de evento para o evento "contextmenu" e chamando o preventDefault()método:

document.addEventListener('contextmenu', event => event.preventDefault());

Dito isto: NÃO FAÇA.

Por quê? Porque ele alcança nada além de usuários irritantes. Muitos navegadores também têm uma opção de segurança para impedir a desativação do menu do botão direito do mouse (contexto).

Não sei por que você gostaria. Se é por alguma crença equivocada que você pode proteger seu código-fonte ou imagens dessa maneira, pense novamente: você não pode.

— cleto
fonte

86

Usar oncontextmenu="return false"algo além do corpo pode fazer sentido, por exemplo, em uma tela.

— precisa saber é o seguinte

62

Estamos implantando em máquinas de quiosque e escolhemos esta maneira para impedir que os usuários atualizem a página.

— Todd Horst

21

@ToddHorst, nesse caso, eu usaria um especial "Kiosk" versão do navegador sem qualquer interface do usuário, que geralmente também está disponível sem quaisquer menus de contexto :)

— mihi

17

Às vezes, os sistemas habilitados para toque mapeiam determinados eventos de toque, como um toque longo, com o botão direito do mouse (e, portanto, abrem o menu de contexto). No entanto, esse comportamento pode ser indesejável e a única maneira significativa de evitá-lo parece desabilitar completamente o menu de contexto.

— OR Mapper

58

Tópico Antigo, mas no caso de alguém ler, nem todos os desenvolvedores da Web criam seus sites para si mesmos, às vezes o cliente chega até você e insiste em desativar o clique direito, quando você tenta convencê-lo, ele apenas procura outro desenvolvedor que o faça sem hesitação

— Danny22

122

NÃO

Apenas não.

Não importa o que você faça, você não pode impedir que os usuários tenham acesso total a todos os dados do seu site. Qualquer Javascript que você codificar pode ser discutido simplesmente desativando o Javascript no navegador (ou usando um plugin como o NoScript). Além disso, não há como desativar a capacidade de qualquer usuário simplesmente "visualizar a fonte" ou "visualizar informações da página" (ou usar o wget) no seu site.

Não vale a pena o esforço. Na verdade, não vai funcionar. Isso tornará seu site hostil aos usuários. Eles vão perceber isso e parar de visitar. Não há benefício em fazer isso, apenas esforço desperdiçado e tráfego perdido.

Não.

Atualização: Parece que este pequeno tópico se mostrou bastante controverso ao longo do tempo. Mesmo assim, eu mantenho esta resposta a esta pergunta. Às vezes, a resposta correta é um conselho, em vez de uma resposta literal.

As pessoas que se deparam com essa questão na esperança de descobrir como criar menus de contexto personalizados devem procurar em outro lugar, como estas:

Criar menus de contexto personalizados com o botão direito do mouse para meu aplicativo Web , que depende do jQuery
Como adicionar um menu personalizado com o botão direito em uma página da Web , que usa javascript / html puro

— Cunha
fonte

230

Uau, não acredito que essa foi uma resposta aceita. Existem muitos usos válidos para remover um clique com o botão direito do mouse em um aplicativo da Web sob condições específicas.

— usar o seguinte comando

84

A resposta real deve ser: #<body oncontextmenu="return false;">

— Sebastián Grignoli 20/03/12

18

@ GAgnew: Existem usos válidos para substituir o menu de contexto. Não há usuários válidos para desativar rightclicks incondicionalmente e sem manuseá-los em um forma- útil

— ThiefMaster

80

Se o usuário quiser criar um videogame HTML5, desativar o botão direito do mouse pode ser bastante útil. Normalmente, isso não é desejável, mas apenas dizer "NÃO" sem o contexto adequado não é tão útil.

— Robson França

51

-1 de mim também. Esta resposta não é útil. Existem muitas boas razões para desativar o botão direito. Por exemplo, criei um aplicativo Web que os hospitais usam na recepção e os usuários não são tecnicamente esclarecidos. Embora o aplicativo esteja sendo executado no navegador da Web, eles não entendem por que todas as opções de menu aparecem quando clicam com o botão direito. Temos inúmeras perguntas de ajuda, perguntando para que servem as opções, de pessoas que pensavam que eram parte do aplicativo. Desativá-los fazia sentido nesse caso, e ocorre em muitos outros aplicativos da web.

— Nicholas

66

A pergunta original era sobre como parar com o botão direito, pois o usuário pode desativar o JavaScript : que parece nefasto e maligno (daí as respostas negativas) - mas todas as duplicatas são redirecionadas aqui, mesmo que muitas das duplicatas estejam pedindo menos propósitos malignos.

Como usar o botão direito do mouse em jogos HTML5, por exemplo. Isso pode ser feito com o código embutido acima, ou um pouco melhor é algo como isto:

document.addEventListener("contextmenu", function(e){
    e.preventDefault();
}, false);

Mas se você estiver fazendo um jogo, então lembre-se que o botão de clique com o botão direito dispara o contextmenu evento - mas também dispara o regulares mousedown e mouseup eventos também. Portanto, você precisa verificar qual propriedade do evento está para ver se foi o botão esquerdo (que === 1), meio (que === 2) ou direito (que === 3) do mouse que está disparando o evento.

Aqui está um exemplo no jQuery - observe que pressionar o botão direito do mouse disparará três eventos: o evento mousedown, o evento contextmenu e o evento mouseup.

// With jQuery
$(document).on({
    "contextmenu": function(e) {
        console.log("ctx menu button:", e.which); 

        // Stop the context menu
        e.preventDefault();
    },
    "mousedown": function(e) { 
        console.log("normal mouse down:", e.which); 
    },
    "mouseup": function(e) { 
        console.log("normal mouse up:", e.which); 
    }
});

Portanto, se você estiver usando os botões esquerdo e direito do mouse em um jogo, precisará fazer alguma lógica condicional nos manipuladores do mouse.

— Sr. Orador
fonte

Se eu tiver ativado dom.event.contextmenu.enabledno Firefox, os eventos mousedowne mouseupainda serão acionados , mesmo que contextmenunão sejam?

— Robertc

43

Se você não se preocupa em alertar o usuário com uma mensagem toda vez que ele tenta clicar com o botão direito, tente adicioná-lo à sua etiqueta corporal

<body oncontextmenu="return false;">

Isso bloqueará todo o acesso ao menu de contexto (não apenas com o botão direito do mouse, mas também com o teclado).

No entanto, como mencionado nas outras respostas, realmente não faz sentido adicionar um desabilitador de clique direito. Qualquer pessoa com conhecimento básico do navegador pode visualizar a fonte e extrair as informações necessárias.

— by0
fonte

Sim, mas há momentos em que quero compartilhar brevemente uma imagem com alguém que estou ciente de que faltam conhecimentos básicos sobre o navegador. Desativar o clique direito não é 100% infalível, mas se eu postar a imagem por apenas alguns minutos para permitir que a pessoa dê uma olhada, é bastante seguro.

— Willo

Às vezes, os sistemas habilitados para toque mapeiam determinados eventos de toque, como um toque longo, com o botão direito do mouse (e, assim, abrem o menu de contexto). No entanto, esse comportamento pode ser indesejável e a única maneira significativa de evitá-lo parece desabilitar completamente o menu de contexto.

— OU Mapper

@ WillO: Eu tenho um caso de uso semelhante que preciso atender, mas, para sua informação, os usuários sempre recorrerão a capturas de tela .

— Hassan Baig

28

Se você é um fã de jquery, use este

    $(function() {
        $(this).bind("contextmenu", function(e) {
            e.preventDefault();
        });
    });

— Vishnu Vikraman
fonte

4

Isso está usando o jQuery sem motivo. Isso faz exatamente o mesmo que a única declaração JavaScript encontrada na resposta do Sr. Speaker, que foi publicada 1 ano e meio antes disso. A propósito, essa resposta também inclui uma solução jQuery, da qual novamente você não precisa. Alguém que aprovou esta resposta sabe o que isso faz? Por que isso aguarda o evento pronto para documento parar de impedir que o menu de contexto apareça? Por que isso é usado thisdentro do evento ready? Por que você usa em bindvez de on? Ugh ...

— Rudey 28/03

20

Primeiro, você não pode conseguir isso sem usar um recurso do lado do cliente. É aqui que o javascript é executado.

Em segundo lugar, se você estiver tentando controlar o que um usuário final pode consumir em seu site, precisará repensar como exibe essas informações. Uma imagem tem um URL público que pode ser buscado via HTTP sem a necessidade de um navegador.

A autenticação pode controlar quem tem acesso a quais recursos.

A marca d'água incorporada nas imagens pode provar que a imagem era de uma pessoa / empresa específica.

No final do dia, o gerenciamento de recursos é realmente um gerenciamento de usuários / convidados.

A primeira regra da Internet, se você não quiser, não a torne pública!

A segunda regra da Internet, se você não quiser, não a coloque na Internet!

— Wayne
fonte

20

Se seu objetivo é impedir que as pessoas possam baixar suas imagens, como a maioria das pessoas disse, desativar o botão direito do mouse é praticamente ineficaz.

Supondo que você esteja tentando proteger imagens, os métodos alternativos são:

Usando um flash player, os usuários não podem baixá-los como tal, mas podem facilmente capturar a tela.

Se você quiser ser mais desagradável, torne a imagem o fundo de uma div, contendo uma imagem transparente, à la -

<div style="background-image: url(YourImage.jpg);">
   <img src="transparent.gif"/>
</div>

será suficiente para impedir o roubo casual de suas imagens (veja uma amostra abaixo), mas como em todas essas técnicas, é trivial derrotar com um entendimento básico de html.

— benofobia
fonte

2

Você pode até carregar a imagem como base64, para ofuscar ainda mais o código.

— Miguel Bartelsman

16

Você não pode realizar o que está solicitando sem usar o Javascript. Qualquer outra tecnologia que você optar por usar só pode ajudar a compor a página da Web no lado do servidor a ser enviada ao navegador.

Simplesmente não existe uma boa solução e não existe um período de solução sem Javascript.

— Anthony
fonte

1

E mesmo assim é irritante para os usuários, sem mencionar fácil de ignorar.

— Manos Dilaverakis

1

Eu só vi páginas com um pop-up modal dizendo 'clique com o botão direito desativado', que mostra o menu com o botão direito quando você o dispensa. Eles também exibem a mensagem quando você rola usando o trackpad, o que é muito irritante.

— Pete Kirkham

1

Sim, é especialmente irritante, pois geralmente é para impedir que as pessoas "roubem" imagens que já estão no disco rígido, mas tudo o que faz é impedir que eu use a Pesquisa de Contexto: addons.mozilla.org/en-US/firefox/addon/240 . Aqueles bastardos ...

— Calvin

2

Eu amo como quase todas as respostas para isso são "Claro, use javascript!"

— Charles Wood

14

Se seu objetivo é impedir que os usuários salvem suas imagens, você também pode verificar se o destino clicado é uma imagem, apenas desative o clique direito nesse caso. Portanto, o clique direito pode ser usado para outros fins. Retirado do código acima:

document.addEventListener("contextmenu", function(e){
    if (e.target.nodeName === "IMG") {
        e.preventDefault();
    }
}, false);

Isso é apenas para tirar a maneira mais fácil de salvar suas imagens, mas ainda pode ser feito.

— Andrew
fonte

Este é, na minha opinião, o melhor caminho a percorrer - como usuário da Web, acho que a funcionalidade do botão direito do mouse é útil de tempos em tempos, mas como uma solução fácil, simples (e sim, fácil de superar), isso funciona sem ser irritante.

— Ben

9

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>
<script type='text/javascript'>//<![CDATA[ 
$(function(){
$('img').bind('contextmenu', function(e){
return false;
}); 
});//]]>  
</script>
</head>
<body>
    <img src="http://www.winergyinc.com/wp-content/uploads/2010/12/ajax.jpg"/>
</body>

— aravind3
fonte

dom.event.contextmenu.enabled

— Robertc

2

@ aravind3 Eu usei o seu exemplo e funciona muito bem! Minhas imagens ainda são clicáveis e funcionam da maneira que deveriam, mas não podem ser baixadas. O motivo pelo qual desejei desativar o clique com o botão direito é que os visitantes que desejam apenas uma imagem e depois saem imediatamente estão afetando minha taxa de rejeição. Pelo menos dessa maneira, minha taxa de rejeição não será tão ruim, pois pode levar 1 ou 2 minutos para descobrir :) Felicidades aravind3 !!!!

— coolydude

6

Faça como abaixo (também funciona no firefox):

$(document).on("contextmenu",function(e){

     if( e.button == 2 ) {
         e.preventDefault();
          callYourownFucntionOrCodeHere();
     }
return true;
});

— nntona
fonte

5

Coloque esse código na sua <head>tag da sua página.

<script type="text/javascript"> 
function disableselect(e){  
return false  
}  

function reEnable(){  
return true  
}  

//if IE4+  
document.onselectstart=new Function ("return false")  
document.oncontextmenu=new Function ("return false")  
//if NS6  
if (window.sidebar){  
document.onmousedown=disableselect  
document.onclick=reEnable  
}
</script>

Isso desativará o clique direito em toda a página da web, mas somente quando o JavaScript estiver ativado.

— tejas
fonte

Isso não funciona no firefox, desabilita a seleção de entrada para a digitação de formulários :(

— ALWAN

5

Eu tinha usado esse código para desativar o botão direito em qualquer página da Web, está funcionando bem. Você pode usar este código

jQuery(document).ready(function(){
  jQuery(function() {
        jQuery(this).bind("contextmenu", function(event) {
            event.preventDefault();
            alert('Right click disable in this site!!')
        });
    });
});

<html>
  <head>
    <title>Right click disable in web page</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  </head>
  <body>
    You write your own code
  </body>
</html>

Expandir snippet

— arvinda kumar
fonte

4

Obviamente, como em todos os outros comentários aqui, isso simplesmente não funciona.

Certa vez, construí um miniaplicativo java simples para um cliente que força a captura de uma imagem a ser feita através da captura de tela e você pode considerar uma técnica semelhante. Funcionou, dentro das limitações, mas ainda acho que foi uma perda de tempo.

— Cruachan
fonte

4

    <script>
        window.oncontextmenu = function () {
            console.log("Right Click Disabled");
            return false;
        }
    </script>

— Anbu
fonte

3

Tente isto

<script language=JavaScript>
//Disable right mouse click Script

var message="Function Disabled!";

function clickIE4(){
if (event.button==2){
alert(message);
return false;
 }
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}

document.oncontextmenu=new Function("alert(message);return false")

</script>

— Dipesh
fonte

3

Desabilitar o clique direito na sua página da web é simples. Existem apenas algumas linhas de código JavaScript que farão esse trabalho. Abaixo está o código JavaScript:

$("html").on("contextmenu",function(e){
   return false;
});

No código acima, eu selecionei a tag. Depois de adicionar apenas essas três linhas de código, o botão direito do mouse será desativado na sua página da web.

Fonte: Desative o botão direito, copie, corte na página da Web usando jQuery

— Faruque Ahamed Mollick
fonte

2

 $(document).ready(function () {
            document.oncontextmenu = document.body.oncontextmenu = function () { return false; }
        });

— soheil bijavar
fonte

2

Sei que estou atrasado, mas quero criar algumas suposições e explicações para a resposta que vou fornecer.

Posso desativar o botão direito do mouse

Posso desativar o botão direito do mouse na minha página da web sem usar o Javascript?

Sim, usando JavaScript, você pode desativar qualquer evento que ocorra e, principalmente, apenas com javaScript. Como tudo que você precisa é:

Um hardware funcional
Um site ou um local no qual você pode aprender sobre os códigos de chave. Porque você vai precisar deles.

Agora, digamos que você queira bloquear a tecla Enter, pressione aqui é o código:

function prevententer () {
 if(event.keyCode == 13) {
  return false;
 }
}

Para o clique direito, use isto:

event.button == 2

no lugar de event.keyCode . E você vai bloquear.

Quero perguntar isso porque a maioria dos navegadores permite que os usuários o desabilitem por Javascript.

Você está certo, os navegadores permitem que você use JavaScript e o javascript faz todo o trabalho para você. Você não precisa configurar nada, apenas o atributo de script na cabeça.

Por que você não deve desativá-lo?

A principal e a resposta rápida para isso seria: os usuários não vão gostar . Todo mundo precisa de liberdade, ninguém, quero dizer, ninguém quer ser bloqueado ou desativado, alguns minutos atrás, eu estava em um site que me impediu de clicar com o botão direito e senti por quê? Você precisa proteger seu código fonte? Então aqui ctrl+shift+Jeu abri o Consolee agora posso ir paraHTML-code aba. Vá em frente e me pare. Isso não adicionará nenhuma camada de segurança ao seu aplicativo.

Existem muitos menus úteis no botão direito do mouse, como Copiar, Colar, Pesquisar no Google por 'texto' (no Chrome) e muito mais. Portanto, o usuário gostaria de obter facilidade de acesso, em vez de se lembrar de muitos atalhos de teclado. Qualquer um ainda pode copiar o contexto, salvar a imagem ou fazer o que quiser.

Os navegadores usam a navegação do mouse: alguns navegadores, como o Opera, usam a navegação do mouse; portanto, se você a desabilitar, o usuário com certeza odiará a interface do usuário e os scripts.

Então esse foi o básico, eu ia escrever um pouco mais sobre como salvar o código-fonte hehehe, mas deixe que seja a resposta para sua pergunta.

Referência aos códigos de chave:

Código da tecla e do botão do mouse:

http://www.w3schools.com/jsref/event_button.asp

https://developer.mozilla.org/en-US/docs/Web/API/event.button (também seria apreciado pelos usuários).

Por que não desativar o botão direito:

http://www.sitepoint.com/dont-disable-right-click/

— Afzaal Ahmad Zeeshan
fonte

1

Javascript:

document.getElementsByTagName("html")[0].setAttribute("oncontextmenu", "return false");

— زي
fonte

0

Nota importante: Depende do navegador e do SO para permitir ou não essa prevenção!

Você deveria fazer isso? Não . Porque isso não impedirá o usuário, mas apenas o irritará.

Você pode usá-lo? Sim . Exemplos: em alguns aplicativos da web em que você deseja ter um menu pop-up personalizado, no jogo, onde os usuários podem ficar aborrecidos quando, por engano, clicam com o botão direito do mouse e em outros casos.

Chrome (v65) no Ubuntu 16.04 = Você pode desativar o botão direito do mouse.

Chrome (v65) no Mac OS 10.11 = NÃO PODE desativar o botão direito.

Chrome (v65) no Windows 7 = NÃO PODE desativar o botão direito.

Firefox (v41) no Mac OS 10.11 = Você pode desativar o botão direito do mouse.

Firefox (v43) no Windows 7 = Você pode desativar o botão direito do mouse.

// Vanilla JS way
document.addEventListener('contextmenu', function(e){
    e.preventDefault();
});

// jQuery way
$(document).bind('contextmenu', function(e) {
    e.preventDefault();
});

— evilReiko
fonte

0

Algumas coisas a considerar:

Os plug-ins de navegador como "ativar o botão direito" na loja do Chrome existem por uma razão e você não poderá contorná-los. Não há literalmente nada que você possa fazer para impedir que as pessoas baixem seu conteúdo, pois elas literalmente precisam baixá-lo para até mesmo vê-lo no navegador; As pessoas tentam, mas sempre está lá fora.

Em geral, se o conteúdo não deve ser público, não o coloque online.

Além disso, não conseguir clicar com o botão direito do mouse é um problema de acessibilidade e, em muitos casos, constitui discriminação ilegal contra cegos, deficientes ou idosos. Verifique as leis locais, mas nos EUA é ativamente contra a lei na forma da ADA Federal, pois os cegos ou idosos que podem ter problemas de visão são uma classe protegida legalmente.

Então, ao invés de fazer isso e desperdiçar muito tempo e esforço, nem se preocupe em tentar fazer isso. Isso poderia simplesmente levar sua empresa a ser processada ou fazer com que falhassem em uma auditoria de conformidade.

— honestduane
fonte

0

Experimente este código para desativar a opção de elemento de inspeção

    jQuery(document).ready(function() {
    function disableSelection(e) {
        if (typeof e.onselectstart != "undefined") e.onselectstart = function() {
            return false
        };
        else if (typeof e.style.MozUserSelect != "undefined") e.style.MozUserSelect = "none";
        else e.onmousedown = function() {
            return false
        };
        e.style.cursor = "default"
    }
    window.onload = function() {
        disableSelection(document.body)
    };

    window.addEventListener("keydown", function(e) {
        if (e.ctrlKey && (e.which == 65 || e.which == 66 || e.which == 67 || e.which == 70 || e.which == 73 || e.which == 80 || e.which == 83 || e.which == 85 || e.which == 86)) {
            e.preventDefault()
        }
    });
    document.keypress = function(e) {
        if (e.ctrlKey && (e.which == 65 || e.which == 66 || e.which == 70 || e.which == 67 || e.which == 73 || e.which == 80 || e.which == 83 || e.which == 85 || e.which == 86)) {}
        return false
    };

    document.onkeydown = function(e) {
        e = e || window.event;
        if (e.keyCode == 123 || e.keyCode == 18) {
            return false
        }
    };

    document.oncontextmenu = function(e) {
        var t = e || window.event;
        var n = t.target || t.srcElement;
        if (n.nodeName != "A") return false
    };
    document.ondragstart = function() {
        return false
    };
});

— Agan116
fonte

1

Obrigado por este trecho de código, que pode fornecer ajuda limitada a curto prazo. Uma explicação adequada melhoraria bastante seu valor a longo prazo, mostrando por que essa é uma boa solução para o problema e a tornaria mais útil para futuros leitores com outras perguntas semelhantes. Por favor edite sua resposta para adicionar alguma explicação, incluindo as suposições que você fez.

— Toby Speight

Isso pode ser extremamente fácil de substituir no Chrome: clique nos 3 pontos ao lado da foto do seu perfil> Mais Ferramentas> Ferramentas do desenvolvedor

— sportzpikachu

-1

Use esta função para desativar o clique direito. Você pode desativar o clique esquerdo e tocar também checking 1 and 0correspondendo

document.onmousedown = rightclickD;
            function rightclickD(e) 
            { 
                e = e||event;
                console.log(e);
                if (e.button == 2) {
                //alert('Right click disabled!!!'); 
                 return false; }
            }

— CodeBreaker
fonte

Usar Javascript para fazer o que o HTML já faz é péssimo em engenharia e desperdício

— honestduane