jQuery 粘贴后验证数字

发布于 2024-09-30 13:58:17 字数 144 浏览 8 评论 0原文

我知道如何验证字段的数值，但是如果将无效字符粘贴到字段中，如何验证该字段。通常我们有一个数字字段，然后有一个操作按钮，当单击操作按钮时，数字字段可能不会触发模糊事件。在这种情况下，如何强制（重新）验证？您是否在操作按钮的单击事件中再次执行此操作，或者是否有更优雅的解决方案？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

说好的呢 2024-10-07 13:58:17

没有真正回答您有关粘贴的问题，而是提供替代方案：您可以订阅表单的 submit 处理程序并在那里执行验证。更优雅的是使用 jquery 验证插件它将完成以下工作为您订阅，这样您只需要定义规则和错误消息：

$(function() {
    $('#myform').validate({
        rules: {
            someFieldName: {
                required: true,
                number: true
            }
        },
        messages: {
            someFieldName: {
                required: 'please enter a value',
                number: 'please enter a valid number'
            }
        }
    });
});

Not really answering your question about pasting but offering an alternative: you could subscribe for the submit handler of the form and perform the validation there. Even more elegant is to use the jquery validation plugin which will do the job of subscribing for you so that you only need to define the rules and error messages:

$(function() {
    $('#myform').validate({
        rules: {
            someFieldName: {
                required: true,
                number: true
            }
        },
        messages: {
            someFieldName: {
                required: 'please enter a value',
                number: 'please enter a valid number'
            }
        }
    });
});

回复收藏 0 原文

皓月长歌 2024-10-07 13:58:17

我使用了这种验证......检查粘贴的文本，如果它包含字母，则向用户显示错误，然后在延迟后清除该框，以便用户检查文本并进行适当的更改。

$('#txtbox').on('paste', function (e) {
    var $this = $(this);
    setTimeout(function (e) {
        if (($this.val()).match(/[^0-9]/g))
        {
            $("#errormsg").html("Only Numerical Characters allowed").show().delay(2500).fadeOut("slow");                       
            setTimeout(function (e) {
                $this.val(null);
            },2500);
        }                   
    }, 5);
});

I used this kind of validation .... checks the pasted text and if it contains alphabets, shows an error for user and then clear out the box after delay for the user to check the text and make appropriate changes.

$('#txtbox').on('paste', function (e) {
    var $this = $(this);
    setTimeout(function (e) {
        if (($this.val()).match(/[^0-9]/g))
        {
            $("#errormsg").html("Only Numerical Characters allowed").show().delay(2500).fadeOut("slow");                       
            setTimeout(function (e) {
                $this.val(null);
            },2500);
        }                   
    }, 5);
});

回复收藏 0 原文

浮生未歇 2024-10-07 13:58:17

我使用粘贴事件来触发 keyup 事件，因为只有使用粘贴事件我才能以某种方式获取输入，但无法操作给定的输入。这是我找到一种方法的方法（顺便说一句，我用它来进行字母验证，但您也可以使用 input type =“number”来验证数字）-

$(".NumberValidateOnPaste").on('paste', function(e) {
  $(e.target).keyup();
});

$('.NumberValidateOnPaste').on('keyup',function(e){
    var value = $(this).val();
    var result = value.match(/^\d*$/);
    
    if(result == null){
      $(this).val('');
    }
    
});

<label for="Pin Code">Pin Code</label>
                <input type="text" name="pin_code" class="form-control NumberValidateOnPaste">
                
 <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

I used paste event to trigger keyup event because only using paste event I can somehow get the input but I couldn't manipulate the input given. Here's how I found a way (btw I used this for alphabet validation but you can use input type = "number" also to validate number)-

$(".NumberValidateOnPaste").on('paste', function(e) {
  $(e.target).keyup();
});

$('.NumberValidateOnPaste').on('keyup',function(e){
    var value = $(this).val();
    var result = value.match(/^\d*$/);
    
    if(result == null){
      $(this).val('');
    }
    
});

<label for="Pin Code">Pin Code</label>
                <input type="text" name="pin_code" class="form-control NumberValidateOnPaste">
                
 <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

回复收藏 0 原文

~没有更多了~