限制从虚拟键盘输入的文本长度答案

【问题标题】：limiting the length of the text entered from the virtual keyboard限制从虚拟键盘输入的文本长度
【发布时间】：2018-05-27 17:41:54
【问题描述】：

我有以下使用软键键盘插件的代码。我在使用虚拟键盘时遇到最大文本长度问题。当我在普通键盘上输入时，最大文本长度为 10 个字符，但是当我开始使用虚拟键盘时，我可以输入我想要的字符数。如何从虚拟键盘输入长度为最多 10 个字符的文本。请帮忙。

    <link rel="stylesheet" href="softkeys-0.0.1.css">

    <style>
       body { background-color:#fafafa; font-family:'Roboto';}
       #v{width:600px; hight:400px; text-align:center; margin:0 auto;}
    </style>
</head>
<body>

<div  style="border:2px inset #AAA ;height:50px; width:500px;font-
family:Lobster;font-size:30px" 
      id="d" ></div>
<script>
$('.softkeys').click(function() {
$('#d').text($(this).val());
});
</script>
<div id="v">
 <input type="text" maxlength="10" id="a" name="code" class="form-control 
input-lg"style="height:50px; width:500px; font-family: 'Lobster', 
cursive;
    font-size:10px"></form>
 <div class="softkeys" data-target="input[name='code']"></div>
                </div>
            </div>
        </div>
    </div>

    <script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="softkeys-0.0.1.js"></script>

    <script>
        $(document).ready(function(){
            $('.softkeys').softkeys({
                target : $('.softkeys').data('target'),
                layout : [
                    [
                        ['`','~'],
                        ['1','!'],
                        ['2','@'],
                        ['3','#'],
                        ['4','$'],
                        ['5','%'],
                        ['6','^'],
                        ['7','&amp;'],
                        ['8','*'],
                        ['9','('],
                        ['0',')'],
                        ['-', '_'],
                        ['=','+'],
                        'delete'
                    ],
                    [

'capslock','q','w','e','r','t','y','u','i','o','p',
                        ['[','{'],
                        [']','}']
                    ],
                    [

                      'shift','a','s','d','f','g','h','j','k','l',
                        [';',':'],
                        ["'",'&quot;'],
                        ['\\','|']
                    ],
                    [

                        'z','x','c','v','b','n','m',
                        [',','&lt;'],
                        ['.','&gt;'],
                        ['/','?'],
                        ['@',]
                    ],
                    ['space'],
                    ['reset']
                ]
            });
        });
    </script>
    <script>
$('.softkeys').click(function(event) {
    $('#d').text($("#a").val());
});

</script>
</body>

【问题讨论】：

标签： jquery keyboard

【解决方案1】：

你可以使用 onchange 事件来防止文本比你想要的长

$("#a").change(function(){
    var text = $(this).val();
    var max = $(this).attr('maxlength') || 10000000;
    if(text.length > max){
        text = text.substring(0, max - 1);
    }
    $(this).val(text);
});

编辑：在不存在 maxlength 属性的情况下，此示例假定 10000000 个字符是限制

【讨论】：