javascript - 单击链接时，如何使其跳转到“名称”部分？

Question

chat_box单击链接时，此代码会自动将值插入输入字段类名称。现在，它工作得很好。

我想在这里再添加一个动作。
我希望它在单击链接时跳转到chat_box部分。

我怎样才能做到这一点？

jQuery(document).ready(function () {
     $(document).on('click', 'a#username', function()  {
         $(".chat_box#body_input").val($(this).attr('value'));
     });
});

Answer 1

使用scrollIntoView

$(".chat_box#body_input").val($(this).attr('value'))[0].scrollIntoView();

更改要求： 如果您需要跳过 20px 以上chat_box并聚焦到输入字段，请尝试以下操作：

var input = $(".chat_box#body_input");
input.val($(this).attr('value'));
$(document).scrollTop(input.offset().top - 20);
input.focus();

Answer 2

你可以这样做：

$(document).on('click', 'a#username', function (e) {
    e.preventDefault();  // Cancel the default action (navigation) of the click
    var $elem = $(".chat_box#body_input");
    $elem.val(this.value);
    $('html, body').animate({
        scrollTop: $elem.offset().top - 20
    }, 'slow');
});