2010-04-29 2 views
8

Я хочу отключить контекстное меню по умолчанию, когда пользователь щелкает правой кнопкой мыши по полю ввода, чтобы я мог показать пользовательский контекстный режим. Вообще говоря, его довольно легко отключить в меню правой кнопкой мыши, делая что-то вроде:jQuery: preventDefault() не работает над событиями ввода/клика?

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

И в самом деле, я могу сделать это на почти каждый элемент КРОМЕ для полей ввода в FF - Кто-нибудь знает, почему и мог укажите мне какую-то документацию?

Вот соответствующий код, с которым я работаю, спасибо, ребята.

HTML:

<script type="text/javascript"> 
var r = new RightClickTool(); 
</script> 

<div id="main"> 
    <input type="text" class="listen rightClick" value="0" /> 
</div> 

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 

EDIT:

К сожалению, после прочтения комментариев я понимаю, что я должен прояснить несколько вещей.

1) Код выше действительно работает ... в некотором смысле. Код может сортировать по какой кнопке щелкнул, мне все равно, что я говорю e.preventDefault(), и появляется меню правой кнопки мыши. Другими словами, если вы ставите предупреждение на e.button, вы получите свой 1 или 0 для левой и 2 для правой ... но он просто смеется надо мной и все еще показывает чертовски меню по умолчанию!

2) Если я поставил селектор jQuery на любой другой элемент (кроме ввода), тогда все будет работать, FF будет уважать вызов preventDefault(), а меню по умолчанию правой кнопкой мыши не будет отображаться.

+0

Как насчет просто 'return false'? –

+0

Кроме того, попробуйте 'e.which' вместо' e.button'. – karim79

+0

Может быть связано http://stackoverflow.com/questions/1489817/jquery-liveclick-firing-for-right-click – scott

ответ

3

Извините, ребята, я знаю, что это отговорка «ответ», потому что я никогда не мог понять, почему именно WebKit браузеры не хотел, чтобы вы баловаться с поля ввода событий, но что угодно, это работает. Таким образом, решение состоит в том, чтобы применить слушателя ко всему окну, а затем просто спросить, имеет ли цель класс, для которого вы хотите применить эффект ... и оттуда. Честно говоря, это, вероятно, лучшее решение, потому что для моего конкретного приложения это позволяет мне применить эту функциональность к любому элементу, который я хочу.

var _class = "input.hideRightClick"; 

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

Я только что протестировал в Firefox 3.6, и он переходит в первый оператор if, поэтому e.preventDefault() никогда не вызывается.

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(); 
    } 
+0

Подождите, это правда, когда вы нажимаете правую кнопку мыши? A) Это не должно. B) Это не на моей машине (FF 3.5.7) – Jason

+0

Кроме того, даже если я помещаю e.preventDefault() перед/вне if/else-if (что означает, что он должен запускать REGARDLESS), ff не кажется беспокоиться. – Jason

11

Решение кросс-браузер, чтобы отключить контекстное меню по умолчанию:

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

Чтобы захватить событие Контекстное только внутри данного использования элемента:

document.getElementById('myElement').oncontextmenu=function(){ 

    // Code to handle event 
    return false; 
} 

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

В JQuery:

$('myElement').bind('contextmenu', function(){ 

    // Handle right-click event. 
    return false; 
}); 

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

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

    }); 

Я испытал это в IE6 (под Wine), Chrome 11, Firefox 3.6, Opera 11 и Safari.

+0

Спасибо за этот Уэйн, хороший материал! – 2012-09-16 17:15:09

+0

любая причина, почему 'if (event.which == 3) {// something}' отменяет контекстное меню disable? – Andreas

Смежные вопросы