Question

我有以下使用软键盘插件的代码。当我使用虚拟键盘时，我遇到了文本最大长度的问题。当我在普通键盘上打字时，文本的最长长度为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>

Answer 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个字符是限制

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

1 个答案: