Javascript jquery中的文本框验证

我正在验证以下条件下的文本框值

它至少应为3个字符

它应该只包含字母表

它应该至少包含一个元音

如果所有条件都匹配，我将启用提交按钮。 如果上述任何一种情况不匹配，我会将错误消息设置为div named error

这是我的密码

$document.ready(function(){

 $('.tbox').focus(); // cursor in text box 
 $(':submit').attr("disabled",true); // disable generate button

    $('.tbox').focus(fucntion(){

        check_the_input()   
    }); 


    });

function check_the_input()
{

    var value = $(this).val();

    $('.tbox').bind('keyup blur',function(){ 
    $(this).val( $(this).val().replace(/[^a-z]/g,'') ); }

    if(value.length > 3)
    {
        if(value.indexOf('a') == -1 && value.indexOf('e') == -1 && value.indexOf('i') == -1 && value.indexOf('o') == -1 && value.indexOf('u') == -1)
        {
            $('#error').text("*Input must contain atleast one vowel");
            $(':submit').attr("disabled",true); 

        }
        else
        {
            $(':submit').attr("disabled",false);
        }

    }
    else
    {
        $('#error').text("*Input should be atleast 3 characters")
        $(':submit').attr("disabled",true); 
    }


    setTimeout(check_the_input,100);
}

我在这里面临以下问题：

如果我输入输入为aa99，输入将更改为aa，但生成的按钮仍处于启用状态

我在键入文本时没有收到错误。只有在按下tab键或在文本框外单击鼠标后，我才发现错误

关于第一个问题：

else
{
    $('#error').text("*Input should be atleast 3 characters")
}

=>

关于第二个问题：

else
{
    $('#error').text("*Input should be atleast 3 characters")
}

编辑输入时，在输入失去焦点之前不会调用回调。 如果要在编辑时更改：submit的样式，可以设置一个定期调用的函数，该函数每隔几毫秒检查一次输入。下面是一个简单的例子：

function check_the_input( )
{
   //routines check the input
   //...

   setTimeout( check_the_input, 100 ); //call me after 0.1 second
}

$(document).ready( function( ) { check_the_input( ) } );

当然，如果你想要更高的效率，还有更多的工作要做

---

修复几个错误，请参见：

我建议重新考虑该方法。考虑这个简单的例子：

HTML:

<form>
  <input type="text" id="myinput"/>
  <button id="submit" type="submit" disabled>Submit</button>
  <p class="error"></p>
</form>

---

如果（！/[aeiou]/i.test（value））{$（'.tbox'）。焦点（function（），则可以执行

操作，而不是5
indexOf
{是的，谢谢。我已经更新了代码。但是我仍然面临同样的问题。如果输入是aaa99，则生成按钮将被禁用，并且只有在按下该键后，输入才会得到验证。对不起..没有问题。你能帮我解决吗..我已经更新了code@srinath，它不是
功能
，而是
功能
，您已经打字太棒了。非常感谢。我想我必须学习过滤器。我会用的。当然，看看，这就是大多数想法的来源。
var $input = $('#myinput');
var $error = $('.error');
var $submit = $('#submit');
var Filters = {
  min: {
    re: /.{3,}/,
    error: 'Must be at least 3 characters.'
  },
  char: {
    re: /^[a-z]+$/i,
    error: 'Must be only letters.'
  },
  vowel: {
    re: /[aeiou]/i,
    error: 'Must have at least one vowel.'
  }
};

function test(value, filters) {
  var isValid = false;
  for (var i in filters) {
    isValid = filters[i].re.test(value);
    $error.hide();
    $submit.prop('disabled', false);
    if (!isValid) {
      $error.show().text(filters[i].error);
      $submit.prop('disabled', true);
      break;
    }
  }
  return isValid;
}

test($input.val(), Filters);
$input.on('keyup blur', function() {
  test(this.value, Filters);
});