分配滚动动画以在 jquery 中聚焦

Question

我有以下代码专注于具有验证错误的输入字段。我想在滚动到焦点位置时添加某种动画（因此，如果您单击提交，它会“滚动到第一个输入字段所在的验证失败的位置）。

有任何想法吗？

 if(validation_failed == true) {
      $(selected_form).find(":input.validator_element_error:visible:enabled").first().focus();
            return false;
        }

Answer 1

您可以在应用焦点之前为 scrollTop 设置动画。这是从您的示例中简化的。

$('html,body').animate({scrollTop: $('input').offset().top}, 200, function() {
    $('input').focus();
});

提琴手

在您的特定情况下，我认为您只需要按照您希望的方式选择错误的输入元素，然后$('input')用您选择的元素替换上面的代码。

var errorInput = $(selected_form).find(":input.validator_element_error:visible:enabled").first();
$('html,body').animate({scrollTop: errorInput.offset().top}, 200, function() {
    errorInput.focus();
});