Phonegap-输入类型的电子邮件最大长度不起作用

Question

此问题在Phonegap上。 我想将maxlength应用于输入框。 但是在电子邮件类型的输入框中，maxlength不起作用。 （在其他类型中，例如密码类型或电话类型，效果很好。）当然，它在网络上效果很好。 该问题仅发生在Phonegap上。 你怎么知道的？

我的密码

<input type="email" data-role="none" placeholder="ID" maxlength="20"/>

+）我找到了这个问题，但没有给我答案。 而且attr('maxlength','5')也帮不了我..

编辑

我发现了这个问题 。 并品尝了4.2版和4.4.2版。 当然，此问题仅在4.4.2版本的设备上不起作用。

解决了

为了查看答案，我试图通过使用以下代码来解决：

var eInput = document.getElementById('Email-input');
var maxLength = eInput.maxLength;
eInput.onkeyup = function(e){
    if( eInput.value.length > maxLength  ){
        eInput.value = eInput.value.substring(0, maxLength );
    }
};

但是，如果我使用此代码，则输入超过maxlength后尝试擦除时，应尝试使用键盘的更多删除按钮。 在此链接中找到了此错误的答案。 需要用空格或重点突出来完成单词，而不是适当清除。 （此问题仅在某些版本中出现。-我认为可能是4.4.2或更高版本。）

所以我用这段代码：

eInput.value += '&nbsp';

它完美地工作！

所有代码：

var eInput = document.getElementById('Email-input');
var maxLength = eInput.maxLength;
eInput.onkeyup = function(e){
    if(eInput.value.length > maxLength){
        eInput.value += '&nbsp';
        eInput.value = eInput.value.substring(0, maxLength);
    }
};

Answer 1

var eInput = document.getElementById('Email-input');
var maxLength = eInput.maxLength;
eInput.onkeyup = function(e){
    if( eInput.value.length > maxLength  ){
        eInput.value = eInput.value.substring(0, maxLength );
    }
};

要么

<input type="email" onKeyDown="if(this.value.length==10) this.value = this.value.slice(0, -1);">

或者您可以尝试此技巧

<input type="email" name="email" pattern=".{6,10}" title="Six or less 10 characters">

也许然后尝试jQuery

看起来是工作

Answer 2

似乎是Android 4.1.2的错误？ 那么，您可以尝试其他任何Android版本吗？ 另外，您是否有同样的问题（达到最大输入值后，无法再执行表单中的任何操作）？

您可以尝试在Google Android论坛上写一些由评论建议的JavaScript。

我也花了几天时间寻找确切的原因。 我也找到了一种解决方案：您需要绑定到keypress事件（尚未尝试使用keyup或keydown，但也可能会起作用）并删除maxlength属性。 我们的解决方案是添加一个data-xxx属性并控制事件处理程序中的长度。 我们已经在做，但是只要存在maxlength并且输入了太多的击键，它就会锁定键输入：不仅在页面上，而且在整个窗口上（我在同一个窗口中导航到Google， t输入击键）。

因此，您正在寻找一些类似于以下的代码：（ 致谢@ sreekumar-sh ）

HTML：

<textarea ng-model="model " rows="3" maxlength="100" cols="70" class="custom_txtarea ng-pristine ng-valid charlength" placeholder="Achievements"></textarea>

JS：

$(".charlength").keypress(function (event) {
    if (event.which >= 32 || event.which == 13) {
        var maxLength = event.currentTarget.maxLength;
        var length = event.currentTarget.value.length;
        if (length >= maxLength) {
            event.preventDefault();
        }
    }
});

另一个（更简单的）解决方案可能是这样的：

<input type="text" onKeyDown="if(this.value.length==8) this.value = this.value.slice(0, -1);">

Answer 3

您可以使用以下代码处理输入和粘贴操作

HTML：

`onpaste="limitInput(this, 150)" onKeyup="limitInput(this, 150)"`

JavaScript：

`function limitInput(element, maxValue) {
     setTimeout(function() {
         if (element.value.length > maxValue) {
             element.value = element.value.slice(0, maxValue);
         }
     }, 100);
}`