2

我试图阻止某些键被输入到输入框中，但前提是在按住该键的同时按下该特定键shift：

$('selector').keydown(function(e) {
  console.log(e.shiftKey);
  if (e.shiftKey && e.which == 51) {
    e.preventDefault();
    alert('Disallowed');
  }
});

警报触发，但字符仍出现在文本框中。

我已经尝试四处寻找解释为什么会发生这种情况但无济于事，任何帮助将不胜感激！

编辑

删除alert似乎可以解决问题（这似乎很奇怪），我真的很想知道为什么它会以这种方式运行，但它似乎没有任何意义。

谢谢

4

3 回答 3

7

只需使用e.which而不是e.keyCode

$('#input').keydown(function(e) {
  if (e.shiftKey && e.which == 51) {
    e.preventDefault();
    alert('Disallowed');
  }
});

工作样本

因为，来自 jQuery 文档：

对于键或鼠标事件，此属性指示按下的特定键或按钮。event.which属性规范event.keyCode和 event.charCode。建议观看event.which进行键盘按键输入。 event.which还标准化按钮按下（mousedown 和 mouseupevents），报告1 为 left button，2 为 middle，3 为 right。使用event.which而不是event.button。

试试这个.keyup()

$('#input').keyup(function(e) {
   var val = $.trim( this.value );
  if (e.shiftKey && e.which == 51) {
    $(this).val(val.replace(/\#/,''));
  }
});

演示

​</p>

如果您尝试从输入中删除井号，请尝试：

$(this).val( val.replace(/\u00A3/g, '') );

完整代码

$('#input').keyup(function(e) {
   var val = $.trim( this.value );
  if (e.shiftKey && e.which == 51) {
    $(this).val( val.replace(/\u00A3/g, '') );
  }
});
于 2012-06-29T14:29:04.103 回答
3

如果现在的问题是：为什么会alert()有所作为？

alert是一个有趣的语句（and confirmand prompt），它暂停了 JavaScript 的执行，但释放了等待 JavaScript 执行的任何其他浏览器处理。它会严重干扰调试。

在您的 JavaScript 完成之前，浏览器不会响应您的preventDefault()声明，放入alert那里已暂停您的 JavaScript，因此浏览器此时尚未收到事件的返回状态，不幸的是alert，浏览器已允许浏览器处理其他事件，即keypress偷偷过去，因此您会看到不想输入的字符出现。

你不能使用alert，或者，如果你需要它（？！），你可以发出它包裹在 asetTimeout中，这样它就不会阻塞你的 JavaScript 并且结果keydown将导致keypress被抑制。

--

或者，您可以一开始就使用keypress！

$('selector').keypress(function(e) {
  console.log(e.shiftKey);
  if (e.which == 163) {
    e.preventDefault();
    alert('Disallowed');
  }
});

不过，这仍然不能阻止通过其他方法输入字符，所以我个人不会一开始就接受这个。：-/

于 2012-06-29T15:50:50.800 回答
1 
$('#selector').keydown(function(e) {
  console.log(e.shiftKey);
  if (e.shiftKey && e.keyCode == 51) {
    $(this).prop('disabled', true);
    //do something, fade an object in...display a message, etc
    setTimeout(function(){
      $(this).prop('disabled', false);
    }, 500);
  }
});

这对我有用。

编辑

添加了 setTimeout 函数来复制您的愿望。

于 2012-06-29T14:42:38.383 回答