禁用右键单击上下文菜单？

此工具增量强度值左键单击强度值递减左键单击值。禁用右键单击上下文菜单？

这会起作用，但是当您通过右键单击来减小值时会出现上下文菜单。

我该如何摆脱它？

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

我明白你的意思：我们在开始处理代码和[重构]（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

代码 * 更新 *而不是全身：

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

而Downvote是因为？ '：）'叹！请小心点灯。 –

您正在禁用全身右键单击。如果我是一个用户，我会讨厌这个。 – Sunyatasattva

@Sunyatasattva你明白，这将启用'onContextMenu'为用户的特定需求，它可以移动到任何html级别的表。呃，容易，对。但是为你的担忧而欢呼的哥们，所以你只是低调地说你讨厌这个哈哈？ **这样的演示** http://jsbin.com/ujaSiTu/1/edit **更新了我的帖子，表格仅禁用**可以做单元格以及 –

偷了这个from a previous answer但改变了一点。给<td>的喜欢...“内功”或任何一个ID，然后试试这个：

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

把这点开始，包括jQuery的代码。

你JSbin

来源

2013-10-12 21:27:39 Deryck

禁用右键单击上下文菜单？

回答

相关问题