Question

我的验证功能看起来像那样。

var fname = $("#fname").val();
var lname = $("#lname").val();

function validate() {
    var isValid = true;
     if (!fname) {
            $("#fname").attr('class', 'invalid');
            isValid=false;
        }

    if (!lname) {
        $("#lname").attr('class', 'invalid');
        isValid=false;
    }

它只是更改未填充的输入框的类。

我知道如果用户填写了一些输入，我可以为每个else写if并更改回默认值（class="valid"）。但是，如何为所有输入创建通用的东西，以便在第一次验证错误后将用户填写的输入更改回默认类？

Answer 1

您可以假设一切都有效，然后尝试反驳，或者您可以尝试证明其有效性。下面采用第一种方法，并将所有类设置为“有效”以与之保持一致。

function validate() {
  // Get the current form input state.
  var fname = $("#fname");
  var lname = $("#lname");

  // Assume everything valid until proven otherwise.
  var isValid = true;
  fname.attr('class', 'valid');
  lname.attr('class', 'valid');

  if (!fname.val()) {
    fname.attr('class', 'invalid');
    isValid=false;
  }

  if (!lname.val()) {
    lname.attr('class', 'invalid');
    isValid=false;
  }

  return isValid;
}

Answer 2

那是很好的Tural！但是，为什么代码中的多余处理？这将增加不必要的压力。因为您为“解决”了所有输入类型文本或密码的“有效”类，只需将其添加到直接代码中的实际输入元素中：

<input class='valid' ..... />

现在，回到原来的验证：为什么不让它普及？：

function validate(formField) {
    if !formField $('#'+formField).removeClass('valid').addClass('invalid');
}

或者那种情况......

Answer 3

确定。我找到了方法

  $('input[type="text"],input[type="password"]').keypress(function () {
        $(this).attr('class', 'valid');
});

JS验证问题

3 个答案: