jquery - 动画后如何设置焦点

Question

我想在使用 div.focus 和 animate() 滚动到页面顶部后将焦点设置在 id 的文本框上，比如说 txtName。

是否有一个功能可以指定在像 document.ready 一样的动画之后在 document.ready 之后执行？

我用来滚动的代码如下所示。

$(".gototop").click(function(){ 
    var focusElement = $("#contents"); 
    $(focusElement).focus(); 
    ScrollToTop(focusElement); 
}); 

function ScrollToTop(el) { 
    $('html, body').animate({ scrollTop: $(el).offset().top - 50 }, 'slow');           
} 

Answer 1

您可以在动画的回调中将焦点设置为元素，这样动画完成时它将获得焦点：

function ScrollToTop(el) { 
    $('html, body').animate({ 
        scrollTop: $(el).offset().top - 50 }, 
    'slow', function() {
        $("#txtName").focus();
    });           
} 

如果el是您希望关注的元素，您可以使用传递的变量而不是#txtName

Answer 2

该animate函数接受一个回调，该回调将在动画完成后执行。你可以这样做：

$(".gototop").click(function(){ 
    var focusElement = $("#contents");
    ScrollToTop(focusElement, function() { focusElement.focus(); }); 
}); 

function ScrollToTop(el, callback) { 
    $('html, body').animate({ scrollTop: $(el).offset().top - 50 }, 'slow', callback);
}