Question

我有一个textarea和一个按钮，我想禁用该按钮，直到textarea达到最小长度。

我想到了类似于这段代码的东西：

＆＃13;

$(document).ready(function() {
$('input[type="submit"]').attr('disabled', true);
$('input[type="text"],textarea').on('keyup',function() {
    var textarea_value = $("#texta").val();
 
    if(textarea_value != '') {
        $('input[type="submit"]').attr('disabled' , false);
    }else{
        $('input[type="submit"]').attr('disabled' , true);
    }
});

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea maxlength="20" minlength="5" rows="4" cols="30" id="texta"></textarea>
<input type="submit" value="next" />

＆＃13;

我尝试将.val更改为.minlength并按照以下方式对其进行测试：

 if(textarea_value < '5') {    
    $('input[type="submit"]').attr('disabled' , false);
 }else{
     $('input[type="submit"]').attr('disabled' , true);
 }

但它不起作用。

任何人都知道如何检查是否达到最小长度的textarea？使用纯javascript或jquery？

Answer 1

要使用jQuery从HTML元素获取某个属性，您可以使用.attr()方法：

获取匹配元素集中第一个元素的属性值，或为每个匹配元素设置一个或多个属性。

参考：api.jquery.com/attr。

以下是代码：

$(document).ready(function() {
$('input[type="submit"]').attr('disabled', true);

$('textarea').on('keyup',function()
{
    var textarea_val = $("#texta").val();
 
    var minLength = $("#texta").attr( 'minlength' );
 
    if(textarea_val != '' && textarea_val.length >= minLength)
    {
        $('input[type="submit"]').attr('disabled' , false);
    }
    else
    {
        $('input[type="submit"]').attr('disabled' , true);
    }
});

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea maxlength="20" minlength="5" rows="4" cols="30" id="texta"></textarea>
<input type="submit" value="next" />

Answer 2

我自己找到了答案，它有点不同，意味着它没有检查最小长度，它确实检查了写的字。

这是 FiddleJS

代码应该是自我解释。

$('input[type="submit"]').attr('disabled', true);
    $('input[type="text"],textarea').on('keyup',function() {
    s = document.getElementById("texta").value;
    s = s.replace(/(^\s*)|(\s*$)/gi,"");
    s = s.replace(/[ ]{2,}/gi," ");
    s = s.replace(/\n /,"\n");
    if (s.split(' ').length >= 3) {
        $('input[type="submit"]').attr('disabled' , false);
    }
    else{
        $('input[type="submit"]').attr('disabled' , true);
    }
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea maxlength="20" minlength="5" rows="4" cols="30" id="texta"></textarea>
<input type="submit" value="next" />

除非达到文本区域的最小长度，否则禁用按钮 - Javascript

2 个答案: