Отключить контекстное меню правой кнопкой?

Этот инструмент приращений значение в силе при левом щелчке на значении силы и декретов значение на левом клике.Отключить контекстное меню правой кнопкой?

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

Как я могу избавиться от него?

CODE AND DEMO

var Alexander = 
 
    { 
 
     Strength: "AlexanderStrengthVal", 
 
     Bonus: "AlexanderRemainingBonusVal", 
 
     Limits: { 
 
     Strength: 60, 
 
       } 
 
    }; 
 

 
function add(character, stat) 
 
{ 
 
    var txtNumber = document.getElementById(character[stat]); 
 
    var newNumber = parseInt(txtNumber.value) + 1; 
 
    var BonusVal = document.getElementById(character["Bonus"]); 
 
    if(BonusVal.value == 0) return; 
 
    var newBonus = parseInt(BonusVal.value) - 1; 
 
    BonusVal.value = newBonus; 
 
    txtNumber.value = newNumber; 
 
} 
 

 
function subtract(character, stat) 
 
{ 
 
    var txtNumber = document.getElementById(character[stat]); 
 
    var newNumber = parseInt(txtNumber.value) - 1; 
 
    if(newNumber < character.Limits[stat]) return; 
 
    var BonusVal = document.getElementById(character["Bonus"]); 
 
    var newBonus = parseInt(BonusVal.value) + 1; 
 
    BonusVal.value = newBonus; 
 
    txtNumber.value = newNumber; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
</head> 
 
<body> 
 
    
 
    <table cellpadding='5' border='1' style="text-align:center; color:#ffffff; background-color:#444444; font-family:arial; font-size:14px"> 
 
    <tr> 
 
     <td><b>Character</b></td> 
 
     <td><b>Strength</b></td> 
 
     <td><b>Spending Bonus</b></td> 
 
    </tr> 
 
    <tr> 
 
     <td>Alexander</td> 
 
     <td> 
 
     <input 
 
     id="AlexanderStrengthVal" 
 
     type="text" value="60" 
 
     style="width:30px; border:none; color:#ffffff; background-color:transparent; text-align:center" 
 
     onfocus="this.blur()" 
 
     onClick="add(Alexander, 'Strength')" 
 
     onContextMenu="subtract(Alexander, 'Strength');" 
 
     /> 
 
     </td> 
 

 
     <td> 
 
     <input 
 
     id="AlexanderRemainingBonusVal" 
 
     type="text" 
 
     value="30" 
 
     style="width:30px; border:none; color:#ffffff; background-color:transparent; text-align:center" 
 
     /> 
 
     </td> 
 
     
 
    </tr> 
 
    </table> 
 
</body> 
 
</html>

источник

2013-10-12 user2811882

Пожалуйста, пост правильный код в ваш вопрос, а не просто ссылки на внешние сайты. –

«Вопросы, связанные с проблемами с кодом, который вы написали, должны описывать конкретную проблему - и ** включить действительный код для его воспроизведения - в самом вопросе **». –

Вы должны будете использовать event.preventDefault(), чтобы предотвратить это произойдет.

В случае вашего кода у вас есть pass the triggering event object as a reference к вашей функции subtract. Как так:

onContextMenu="subtract(event, Alexander, 'Strength');" // This is in the HTML 

function subtract(e, character, stat) 
{ 
    e.preventDefault(); 
    // The rest of your code… 
}

Working example

Но, пожалуйста, обратите внимание, что ваш код является беспорядок. Во-первых, в JSBin он выводит ряд предупреждений, которые вы должны изучить. Иными словами, you shouldn't bind your event handlers inline. Please separate your concerns.

источник

2013-10-12 21:24:22 Sunyatasattva

Я понимаю, что вы имеете в виду: мы все делаем некоторые компромиссы, когда начинаем работать над кодом, а затем [refactor] (https://en.wikipedia.org/wiki/Code_refactoring). Но поверьте мне, если вы начнете с чистого кода, вы поблагодарите себя позже.На самом деле нет причин не использовать привязки событий или CSS вместо встроенного всего, на самом деле это занимает больше времени. – Sunyatasattva

+1, хороший ответ! ':))' –

@ user2811882 То, как вы это делаете, вполне приемлемо. Альтернативой было бы использовать ['Math.max()'] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max) для минимального и [' Math.min() '] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/min) для максимального (я знаю, запутываю :)) – Sunyatasattva

Может попробовать этот

http://jsbin.com/OGoLuHa/1/edit

код * Update * вместо всего тела:

http://jsbin.com/ujaSiTu/1/edit

<table cellpadding='5' border='1' style="text-align:center; color:#ffffff; background-color:#444444; font-family:arial; font-size:14px" oncontextmenu="return false;">

<body oncontextmenu="return false;">

Тогда только этот код будет выполнен.

function subtract(character, stat) 
{ 
    alert('Substract context Menu'); 
    var txtNumber = document.getElementById(character[stat]); 
    alert(txtNumber); 
    var newNumber = parseInt(txtNumber.value) - 1; 
    alert(newNumber); 
    if(newNumber < character.Limits[stat]) return; 
    var BonusVal = document.getElementById(character["Bonus"]); 
    var newBonus = parseInt(BonusVal.value) + 1; 
    BonusVal.value = newBonus; 
    txtNumber.value = newNumber; 
    alert(newNumber); 

}

источник

2013-10-12 21:27:24

И вниз, потому что? ':)' Sighhh! Позаботьтесь о том, чтобы пролить свет. –

Вы отключите правый щелчок по всему телу. Если бы я был пользователем, я бы ненавидел это. – Sunyatasattva

@Sunyatasattva вы понимаете, что это позволит 'onContextMenu' для конкретной потребности пользователя, он может перемещаться в таблицу любого уровня html. Хорошо, хорошо. Но ура для ваших проблем, чувак, ТАК, вы проигнорировали только то, что вы ненавидите этот LOL? ** Демо-версия, подобная этому ** http://jsbin.com/ujaSiTu/1/edit ** обновила мою почту только с отключенной таблицей ** могла сделать ячейку также –

Украл этот from a previous answer, но немного изменился. Дайте <td> идентификатор как ... «Strength» или что-то, а затем попробовать это:

$(document).ready(function() {  
$('#strength').bind('contextmenu', function(e) { 
     return false; 
    }); 
});

Помещенный, что в начале и включить JQuery в коде.

Ваш JSbin

источник

2013-10-12 21:27:39 Deryck

Отключить контекстное меню правой кнопкой?

ответ

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