jQuery: preventDefault () não está funcionando em events de input / clique?

Desejo desativar o contextMenu padrão quando um usuário clica com o botão direito do mouse em um campo de input para que eu possa mostrar um contextMenu personalizado. De um modo geral, é muito fácil desativar o menu do botão direito, fazendo algo como:

$([whatever]).bind("click", function(e) { e.preventDefault(); }); 

E, de fato, posso fazer isso em praticamente todos os elementos EXCETO para campos de input no FF – alguém sabe por que ou poderia me indicar alguma documentação?

Aqui está o código relevante com o qual estou trabalhando, obrigado pessoal.

HTML:

  var r = new RightClickTool();  

JS:

 function RightClickTool(){ var _this = this; var _items = ".rightClick"; $(document).ready(function() { _this.init(); }); this.init = function() { _this.setListeners(); } this.setListeners = function() { $(_items).click(function(e) { var webKit = !$.browser.msie && e.button == 0; var ie = $.browser.msie && e.button == 1; if(webKit||ie) { // Left mouse...do something() } else if(e.button == 2) { e.preventDefault(); // Right mouse...do something else(); } }); } } // Ends Class 

EDITAR:

Desculpe, depois de ler os comentários, percebo que devo esclarecer algumas coisas.

1) O código acima funciona … de certa forma. O código é capaz de classificar através de qual botão foi clicado, apenas não importa que eu diga e.preventDefault () e o menu do botão direito ainda aparece. Em outras palavras, se você colocar um alerta no e.button você obteria o seu 1 ou 0 para a esquerda e 2 para a direita … mas apenas ri de mim e ainda mostra o maldito menu padrão!

2) Se eu colocar o seletor do jQuery em QUALQUER outro elemento (diferente de input), então tudo irá funcionar, o FF respeitará a chamada preventDefault () e o menu padrão do botão direito não será mostrado.

Uma solução entre navegadores para desativar o menu de contexto padrão:

 window.oncontextmenu = function() { return false }; 

Para capturar o evento contextmenu somente dentro de um determinado elemento, use:

 document.getElementById('myElement').oncontextmenu=function(){ // Code to handle event return false; } 

Você obterá resultados diferentes dependendo do cenário de evento e do navegador exatos, se tentar methods diferentes de oncontextmenu para interromper um evento de clique com o botão direito do mouse.

Em jQuery:

 $('myElement').bind('contextmenu', function(){ // Handle right-click event. return false; }); 

Você também pode usar event.which do jQuery para determinar qual botão foi pressionado, mas você ainda terá que cancelar o evento contextmenu padrão:

  // Cancel default oncontextmenu event. $(element).bind('contextmenu', function(){ return false }); $(element).mousedown(function(event){ switch (event.which) case 1: // Left mouse break; case 2: // Middle mouse break; case 3: // Right mouse. break; }); 

Eu testei isso no IE6 (no Wine), no Chrome 11, no Firefox 3.6, no Opera 11 e no Safari.

Desculpe pessoal, eu sei que isso é uma “resposta” porque eu nunca fui capaz de descobrir exatamente por que os navegadores webkit não gostam de mexer com events de campo de input, mas o que quer que isso funcione. Portanto, a solução é aplicar o ouvinte a toda a janela e, em seguida, apenas perguntar se o destino tem a class que você deseja aplicar o efeito para … e de lá ir. Para ser honesto, esta é provavelmente uma solução melhor, porque para o meu aplicativo em particular, isso me permite aplicar essa funcionalidade a qualquer elemento que eu queira.

 var _class = "input.hideRightClick"; this.setListeners = function() { $(window).click(function(e) { if($(e.target).is(_class)) { e.preventDefault(); alert("hide!"); } }); } 

Acabei de testar no Firefox 3.6 e está seguindo para a primeira instrução if, então o e.preventDefault () nunca é chamado.

  var webKit = !$.browser.msie && e.button == 0; // TRUE IN FIREFOX 3.6 var ie = $.browser.msie && e.button == 1; if(webKit||ie) { // Left mouse...do something() } else if(e.button == 2) { e.preventDefault(); // Right mouse...do something else(); } 
Intereting Posts