6

我有一个名为restrict-numbers 的类的输入文件,我想将输入的字符限制为只接受数字,我使用了下面的代码,这很好,但是我想要进行相同的限制的问题适用于在输入中粘贴在没有完全禁用粘贴的情况下提交:

function input_only_numbers(){
$("input[type=text]").each(function(){
if( $(this).hasClass("restrict-numbers") ){    
    $(this).keydown(function(event) {
    if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || 

        // Allow: Ctrl+A
    (event.keyCode == 65 && event.ctrlKey === true) ||

        // Allow: Ctrl+V
    (event.ctrlKey == true && (event.which == '118' || event.which == '86')) ||

        // Allow: Ctrl+c
    (event.ctrlKey == true && (event.which == '99' || event.which == '67')) ||

        // Allow: Ctrl+x
    (event.ctrlKey == true && (event.which == '120' || event.which == '88')) ||

        // Allow: home, end, left, right
    (event.keyCode >= 35 && event.keyCode <= 39)) {
    // let it happen, don't do anything
        return;
    }
    else {
    // Ensure that it is a number and stop the keypress
        if ( event.shiftKey|| (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 ) ){
        event.preventDefault(); 
        }
    }
    });
}




});

}

4

7 回答 7

2

使用jquery.numeric插件实现您的表单。

$(document).ready(function(){
    $(".numeric").numeric();
});

此外,这也适用于 textareas!

或者更好地在用户尝试提交时更改输入,

$('form').submit(function () {
    if ($('#numeric').value != $('#numeric').value.replace(/[^0-9\.]/g, '')) {
       $('#numeric').value = $('#numeric').value.replace(/[^0-9\.]/g, '');
    }
});

这就是你正在做的,你想删除字符,而不是数字,所以为什么要这么努力,只是在最后删除它们。

这是我最喜欢的选择,

尝试 HTML5数字输入:

<input type="number" value="0" min="0"> 

对于不兼容的浏览器,有ModernizrWebforms2后备。

或者

您也可以将“粘贴”操作绑定到函数,

$( "#input" ).on("paste", function() {
    if ($('"#input').val() != $('"#input').val().replace(/[^\d\.]/g,"")) 
    { $('"#input').val($('"#input').val().replace(/[^\d\.]/g,""));
    }
});
于 2013-08-19T10:29:02.530 回答
2
$(".numbersOnly").bind('paste', function(e) {
        var self = this;
        setTimeout(function(e) {
            var val = $(self).val();
            if (val != '0') {
                var regx = new RegExp(/^[0-9]+$/);
                if (!regx.test(val)) {
                    $(".numbersOnly").val("");
                }
                $(this).val(val);
            }
        }, 0);
    });
于 2018-01-12T06:57:42.970 回答
1

如果您不控制用户按下的实际键,而是控制输入字段的内容,也许您可​​以减少自己的工作量?您仍然可以使用 keyup-event,但是,您应该通过在其上$(this).val()应用合适的正则表达式来查看输入字段 ( ) 的当前内容,而不是检查键码。

这样,用户可以以任何喜欢的方式工作,但您仍然可以完全控制您允许的内容,而不会让您自己太复杂!

编辑(回复评论):

擎天柱已经提供了一些非常有用的代码,我的版本是这样的

$( "input[type=text]" ).on("keyup", function() {
  var o,v=(o=$(this)).val();
  o.val(v.replace(/[^\d]/g,""));
});

正则表达式仍然有些粗糙。随意在这里改进它:http: //jsfiddle.net/zWDGS/(或这个版本:http: //jsfiddle.net/zWDGS/1/)。

于 2013-08-19T10:26:56.343 回答
0

实现表单的其他插件是jquery.autonumeric

jQuery(function($) {
      $('#someID_defaults').autoNumeric('init');    
  });
于 2013-12-17T19:33:23.723 回答
0
$(document).ready(function() 
{
    $("#test").keydown(function(event) {
        // Allow: backspace, delete, tab, escape, and enter
        if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 || 
                // Allow: Ctrl+V
                (event.ctrlKey == true && (event.which == '118' || event.which == '86')) ||  
                // Allow: Ctrl+c
                (event.ctrlKey == true && (event.which == '99' || event.which == '67')) || 
                // Allow: Ctrl+A
            (event.keyCode == 65 && event.ctrlKey === true) || 
             // Allow: home, end, left, right
            (event.keyCode >= 35 && event.keyCode <= 39)) {
                 // let it happen, don't do anything
                 return;
        }
        else {
            // Ensure that it is a number and stop the keypress
            if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
                event.preventDefault(); 
            }   
        }
    });
});

以上工作正常,因为它限制数字并且不允许字符,您可以粘贴数字

于 2013-12-19T08:55:33.653 回答
0

其实对于jquery来说一定是这样的;

$('.just_numbers').on('paste keyup', function(e){ $(this).val($(this).val().replace(/[^\d]/g, '')); });

粘贴也,按下也忽略除数字。

于 2019-10-22T13:52:19.197 回答
0

此代码适用于 javascript,并在我的 Angular 应用程序中使用。

jQuery('#Id').on('paste keyup', function(e){
    jQuery(this).val(document.getElementById('Id').value.replace(/[^\d]/g, ''));
  });

其中 Id 是输入字段 id,它被阻止输入并粘贴到字段中的字母。

于 2019-06-05T06:14:03.727 回答