【问题标题】:add dash in inputbox在输入框中添加破折号
【发布时间】:2012-10-31 17:48:15
【问题描述】:

如何创建一个在六位数字后自动添加破折号的输入字段。 也应该只能在输入字段中写入数字。

这可以使用 jQuery 完成吗?

【问题讨论】:

    标签: javascript jquery jquery-validate inputbox


    【解决方案1】:

    借用本帖代码:How to allow only numeric (0-9) in HTML inputbox using jQuery?

    您可以添加条件来捕获长度。

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js"></script>
    
    <script>
    $(document).ready(function() {
        $("#txtboxToFilter").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+A
                (event.keyCode == 65 && event.ctrlKey === true) || 
                 // Allow: home, end, left, right
                (event.keyCode >= 35 && event.keyCode <= 39)) {
                     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(); 
                }   
            }
    
            if(  $("#txtboxToFilter").val().length == 6 )
           {
                event.target.value = event.target.value + "-";
           }
        });
    });
    </script>
    
    <form>
    
    <input type="text" id="txtboxToFilter">
    
    </form>
    

    【讨论】:

    • 您可能需要修改 keyup 处理程序以每 6 位添加一个破折号。这只会在前六位数字之后添加破折号,但您会得到图片。
    • 它有效。但是,如果您只按键盘上的一位数字,它就不会添加破折号。
    • 你是对的 stefan。我总是忘记用户可以按住一个键...无论如何,我会更新帖子
    • 这会破坏粘贴:ctrl+v 不起作用,其他形式的粘贴会覆盖keyup,所以获取也不过滤,也不格式化。
    【解决方案2】:
    jQuery('#inputFieldId').keydown(function(event) {
                var enteredValue = jQuery(this).val();
                if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 || 
                       (event.keyCode == 65 && event.ctrlKey === true) || (event.keyCode >= 35 && event.keyCode <= 39) || 
                       (event.keyCode>=48 && event.keyCode<=57) || (event.keyCode>=96 && event.keyCode<=105)) // allow numbers
                    {
                       if(enteredValue.length==6 && ((event.keyCode>=48 && event.keyCode<=57) || (event.keyCode>=96 && event.keyCode<=105)))
                       {
                        jQuery(this).val(enteredValue+"-")
                       }
                   }
                else
                {
                    event.preventDefault();
                }
            });
    

    现在更正了代码,试试这个。

    【讨论】:

    • 是的,它工作正常。但是如果你只是按住一个键,它不会添加破折号。
    • 现在我根据 Blaise 的回答更正了代码并检查了其他条件。我已经测试了代码,它只允许使用按住键的数字。
    • 感谢 Bhushan。现在工作正常 =)
    • 也可以用小键盘输入吗?
    • 不是。认为我需要添加这个或类似的东西:event.keyCode>=48 && event.keyCode
    猜你喜欢
    • 2020-09-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-07
    • 1970-01-01
    • 2023-04-06
    • 2013-06-03
    • 2014-07-25
    相关资源
    最近更新 更多