代码之家 › 专栏 › 技术社区 › Gal

jquery中触发模糊效果后的回调函数

handler function events jquery

Gal · 技术社区 · 16 年前

我有一个表单,一旦用户从输入字段中“模糊”出来,它就会被验证。所以:

$("#field1").blur(function() {

if($(this).val().length>0) {
   $(this).attr('class', 'completed');
}

});

当用户第一次访问表单时,直到所有字段都“完成”为止,“提交”按钮将隐藏:

$(".submit").hide();

我试过使用:

$("#field1").blur(function() {
    if($(".completed").length == $("input[type='text']").length) {
        $(".submit").slideDown(1000);
    }
});

但是它不能工作,因为它是与前面的“blur”处理程序同时调用的。

是否有一个方法可以将事件处理程序绑定到之后

我很感激所有类型的解决方案(不一定像我介绍的那样)。

3 回复 | 直到 16 年前

mati 16 年前

好吧,您不一定需要设置css类来执行此类验证:

$("#field1").blur(function() {
    if($("input[type='text']"),filter(isCompleted).length == $("input[type='text']").length) {
        $(".submit").slideDown(1000);
    }
});

function isCompleted(i) {
    return $(this).val().length > 0;
}

另一种方法是:

$("#field1").blur(function() {
    // If there are not empty textboxes, slidedown...
    if($(":text[value='']").length === 0) {
        $(".submit").slideDown(1000);
    }
});

Marko 16 年前

只需在第一个.blur方法中进行检查,不过我建议使用类名来防止页面上的任何其他输入干扰。

$(".input-field").blur(function() {
  if($(this).val().length>0) {
   $(this).addClass('completed');
  }
  setTimeout("isFormValid()", 100);
});

function isFormValid() {
  if($(".completed").length == $(".input-field").length) {
    $(".submit").slideDown(1000);
  }
}

Dave Ward 16 年前

$('input').blur(function() {
  if (this.value.length > 0)
    $(this).addClass('validationError');
  else
    $(this).removeClass('validationError');

  validateForm($(this).parents('form'));
});

funciton validateForm($form) {
  if ($form.has('.error').length > 0)
    $('.submit').slideUp();
  else
    $('.submit').slideDown();
}

推荐文章