Question

我正在尝试验证只允许字母的字段。如果我写了一个数字或另一个符号，整个字段将变为红色，我将无法点击“提交”按钮。该按钮将被锁定，直到一切正常。

一个人给了我这个：

$("#form-description").on("keyup", function() {
  var text = $(this).val();
  var a = 120 - text.length;
  var lettersonly = /^[a-zA-Z]+$/;
  if (!/^[a-zA-Z\s]*$/.test(text)) {
    $(this).parent().css("border", "1px solid red");
  }
  $("#error-description").text(a), a < 10 && $("#charcount").css({
    color: "red"
  })
});
$('#herter').on('keydown', function(e) {
  if (e.which == 9) { //9 is tab key, 13 is enter key
    var text = $(this).val();
    if (text.length > 50) {
      alert("You have entered too much text. The maximum for this field is 50 characters.")
    } else if (text.length < 1) {
      alert("Please enter some text.");
    }

  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td><input type='text' class="form-text" id='herter' maxlength="60" name='txtnombre' required /><span class="error-form" id="error-name"></span></td>
<td>
  <div>
    <input type='text' class="form-text" id="form-description" name="txtdescripcion" />
  </div>

  <span class="error-form" id="error-description"></span></td>
<div id="charcount">
</div>

如果我写了一个数字，该字段变为红色但是当我删除字段上的所有内容时它不会消失...或者例如如果我写“Hello word4”如果我删除数字4该字段保持红色：/。

如果您编写一个数字，它必须显示警告，并且必须使用TAB键或单击字段验证每个字段

此外，提交按钮未锁定，如果字段为“红色”，则提交按钮仍然有效：/。

不知道该怎么做：S

Answer 1

这可以帮助您朝着正确的方向前进。这将添加＆＃34;错误＆＃34;使用类＆＃34;验证＆＃34;的任何输入的类。验证字段后，doValidation将查找任何错误。如果发现错误，如果没有找到按钮，则会禁用该按钮，它将再次启用该按钮。相当直接。

＆＃13;

let doValidation = (field) => {
  // Check for the amount of none letter chars
  if(field.value.replace(/[A-z]/g,"").length)
    // If found add error
    $(field).addClass('error');
  else
    // If none found ensure no error
    $(field).removeClass('error');
  
  // Check total input errors
  if($('.error').length)
    // If some are found disable button
    $('input[type=button]').attr('disabled','true');
  else
    // If none are found enable button
    $('input[type=button]').removeAttr('disabled');
}

// Runs when field is clicked or focus is lost (Tab)
$('.validate').on('click focusout',function(){
  doValidation(this);
});

＆＃13;

.error {
  border-color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" class="validate">
<input type="text" class="validate">

<input type="button" value="Submit">

＆＃13;

验证字段仅为字母jquery / ajax

1 个答案: