使用jquery在文本字段中禁用字母表的复制粘贴

在我的项目中,我的文本字段只取数值。但是当我使用ctl + c复制字母并使用ctl + v粘贴时,它将允许文本字段中的字母表。所以我禁用了使用以下内容的复制和粘贴码。

$('input').bind('copy paste', function(e) { e.preventDefault(); }); 

但我想只防止字母表。这意味着我想复制粘贴数值不是字母。

试试这个function。 这可能不是你想要的,但你可以做一些事情。 我之前已经这样做了并发布在我的博客上。

JS:

  $(function(){ $(".numericOnly").bind('keypress',function(e){ if(e.keyCode == '9' || e.keyCode == '16'){ return; } var code; if (e.keyCode) code = e.keyCode; else if (e.which) code = e.which; if(e.which == 46) return false; if (code == 8 || code == 46) return true; if (code < 48 || code > 57) return false; } ); $(".numericOnly").bind("paste",function(e) { e.preventDefault(); }); $(".numericOnly").bind('mouseenter',function(e){ var val = $(this).val(); if (val!='0'){ val=val.replace(/[^0-9]+/g, "") $(this).val(val); } }); }); 

HTML:

     

这将允许您仅输入数字值。 你甚至无法复制粘贴和拖放。

DEMO

代码链接

看了一下事件对象和“duckduckgoing”之后:

 $('input').on('paste', function (event) { if (event.originalEvent.clipboardData.getData('Text').match(/[^\d]/)) { event.preventDefault(); } }); 

我不知道这是什么跨浏览器,但如果向后兼容性没有问题,请继续使用它。

在codepen上查看

PS:我在mac os 10.6上使用谷歌chrome版本22

编辑:firefox 13没有clipboardData对象,即10也没有,safari 5.1.2支持它(所以它是一个webkitfunction)。

这个函数适用于jQuery。 它只允许数字到文本框代码:

 jQuery.fn.filter = function() { $(this).keydown(function (e) { if (e.shiftKey || e.ctrlKey || e.altKey) { // if shift, ctrl or alt keys held down e.preventDefault(); // Prevent character input } else { var n = e.keyCode; if (!((n == 8) // backspace || (n == 46) // delete || (n >= 35 && n <= 40) // arrow keys/home/end || (n >= 48 && n <= 57) // numbers on keyboard || (n >= 96 && n <= 105)) // number on keypad ) { e.preventDefault(); // Prevent character input } } $(document).mousedown(function(e){ if( e.button == 2 ) { e.preventDefault(); // Prevent character input } else { var n = e.keyCode; if (!((n == 8) // backspace || (n == 46) // delete || (n >= 35 && n <= 40) // arrow keys/home/end || (n >= 48 && n <= 57) // numbers on keyboard || (n >= 96 && n <= 105)) // number on keypad ) { e.preventDefault(); } } }); } 

我确定你的需要,但试试这个。 如果它不是你想要的sry。

我有一个有趣的解决方法来解决你的问题。 对于paste事件,您可以使用以下代码:

 $("input").on("paste", function(e) { var that = this; that.style.color = "#fff"; // field background color setTimeout(function() { that.value = that.value.replace(/\D/g, ""); that.style.color = "#000"; // normal field font color }, 100); });​ 

演示: http //jsfiddle.net/dgWDX/

jaychapani提供的解决方案几乎适用于该用户的特定问题。 但是,它可以防止粘贴任何东西,甚至数字。

我略微修改了代码,现在Javascript(a)允许用户粘贴数字,但(b)不允许使用字母和特殊字符。 我从上面jaychapani的例子中删除了以下内容:

  $(".numericOnly").bind("paste",function(e) { e.preventDefault(); }); 

最终的代码是:

  $(function(){ $(".numericOnly").bind('keypress',function(e){ if(e.keyCode == '9' || e.keyCode == '16'){ return; } var code; if (e.keyCode) code = e.keyCode; else if (e.which) code = e.which; if(e.which == 46) return false; if (code == 8 || code == 46) return true; if (code < 48 || code > 57) return false; } ); $(".numericOnly").bind('mouseenter',function(e){ var val = $(this).val(); if (val!='0'){ val=val.replace(/[^0-9]+/g, "") $(this).val(val); } }); }); 

这有效,并且在使用Ctl + v或菜单粘贴时会拒绝字母和特殊字符。 但是,我注意到,在用户在表单拒绝之前粘贴不需要的字符后,有时会出现延迟。

通常,拒绝不需要的字符只会在一两秒后发生。 但是有一些实例在文本被清除之前等待了大约10秒。 我猜这是因为(a)我很清醒地观察行为和一些奇怪的缓存行为导致Javascript的延迟快速工作或(b)Javascript的某些循环问题或(c)一些组合的都。

这在大多数生产环境中都可以正常工作。 我怀疑用户在提交之前反复刷新页面。

但是,我想知道是否有更优化的解决方案。 关于改进这一点的建议将受到欢迎。

我已经更新了jaychapani的答案。 在这里,我添加了对箭头键的支持。 并防止按% & (键。

  $("input").bind('keypress', function (e) { if (e.keyCode == '9' || e.keyCode == '16') { return; } var code; if (e.keyCode) code = e.keyCode; else if (e.which) code = e.which; if (e.which == 46) return false; if (e.which == 33 || e.which == 64 || e.which == 35 || e.which == 36 || e.which == 37 || e.which == 94 || e.which == 38 || e.which == 42 || e.which == 40 || e.which == 41) return false; if (code == 8 || code == 46) return true; if (code == 37 || code == 38 || code == 39 || code == 40) return true; if (code < 48 || code > 57) return false; }); $("input").bind("paste", function (e) { e.preventDefault(); }); $("input").bind('mouseenter', function (e) { var val = $(this).val(); if (val != '0') { val = val.replace(/[^0-9]+/g, "") $(this).val(val); } }); 

JSFiddle演示

谢谢。