0

我试图计算和限制来自两个文本字段的用户输入。这意味着最大字符为 20，然后用户只能在两个文本字段中输入 20 字符。我试过这样

$(document).ready( function() {

jQuery.fn.getLength = function(){
var count = 0;
var max=$("#max").val();
this.each(function(){
   count += jQuery(this).val().length;
     });   
 var rem=max-count;
return rem;
};

var $inputs= jQuery('#left,#right');
$inputs.bind('keyup',function(){
    var remain=$inputs.getLength();
 jQuery('#count').html($inputs.getLength());
    $("#left").keyup(function(){
        if($("#left").val().length > remain){
        $("#left").val($("#left").val().substr(0, remain));
        }
    });

    $("#right").keyup(function(){
        if($("#right").val().length > remain){
        $("#right").val($("#right").val().substr(0, remain));
        }
    });

});

});

但它仅适用于单个文本框，不能从 2 个字段中获取值。任何帮助请..

4

4 回答 4

2

演示：http: //jsfiddle.net/EEbuJ/2/

jQuery

$('#left, #right').keyup(function(e) {
    if (maxLen() <= 20)
    {
        // Save the value in a custom data attribute
        $(this).data('val', $(this).val());
    } else {
        // over-ride value with saved data
        $(this).val($(this).data('val'));
    }
});

function maxLen() {
    var x = 0;

    $('#left, #right').each(function() {
        x += $(this).val().length;
    });

    return x;
};

如果指定输入中的字符总数不超过 20，这会将输入的输入值保存到自定义数据属性。

当达到最大字符数时，我们停止保存输入的值并将该值恢复为我们之前保存的值（即小于最大值），从而有效地撤消该值。

于 2013-09-09T10:40:03.617 回答
2

您只需要这段代码，它会检测 #left 或 #right 中的按键，如果两者的计数超过 20，它会删除最后输入的字符

$("#left,#right").keyup(function () {
    var charCount = $('#left').val().length + $('#right').val().length;
    if (charCount > 20) {
        difference = -Math.abs(charCount - 20);
        $(this).val($(this).val().slice(0, difference));
    }
});

演示http://jsfiddle.net/k8nMY/

我的第一个解决方案在 keydown 上工作，并使用 return false 来阻止进一步的输入，但是这具有禁用退格键和其他键的效果。

这个在 keyup 上执行的解决方案会等到按键被按下然后计数字符。如果数字超过 20，它将删除最后输入的字符。这样，用户仍然可以按退格键并根据需要进行更改，但不会超过 20 个字符。

我还进一步修改了脚本，它的作用是检测任何更改，例如粘贴长字符串。它消除了 20 个字符以上的“差异”。

这应该是问题的完整解决方案。

于 2013-09-09T10:40:34.887 回答
0

好吧，这应该很容易：http: //jsfiddle.net/4DETE/1/

var textLength =$inputs.eq(0).val().length+$inputs.eq(1).val().length;
if(textLength>=20)
    return false

只计算值的长度，如果要限制更多元素，请使用 jquery.each 迭代输入

于 2013-09-09T10:43:49.510 回答
0

我怀疑您可以这样做$inputs.getLength()，因为 $inputs 是一个数组，因此将返回数组长度：2
您必须将两个输入中的总符号长度相加：

$('#left,#right').keydown(function(){
    var leftlength = $('#left').val().length;
    var rightlength = $('#right').val().length;
   if(leftlength + rightlength > 20)
   {
    return false;
   }
});

或者让它更短

if($('#left').val().length+$('#right').val().length >20){return false;}
于 2013-09-09T10:44:20.700 回答