JS跳轉到指定元素的位置

 

需求背景

在開發過程中，經常遇到用戶提出 如果某個內容沒有填寫，則需要彈出提示，並且將頁面滾動到指定位置的需求。那這種情況應該怎么實現呢？
具體代碼如下：

一、給鏈接a加個#的方式來實現跳轉。

div1 div2 div3

< div id = "container" >

     < a href = "#div1" >div1</ a >

     < a href = "#div2" >div2</ a >

     < a href = "#div3" >div3</ a >

</ div >

直接模擬點擊鏈接事件即可實現跳轉。

缺點：刷新界面或者回退的時候，會有問題。 

 

二、用animate屬性

 

<input id="selectDepartManager" class="ant-input monthInput" style="width: 200px;" type="text" />

 $(".monthInput").blur(function () {
           
            if ($(this).val().trim() == '') {
      $("html, body").animate(
                        { scrollTop: $(this).offset().top },
                        { duration: 500, easing: "swing" }
                    );
                return;
            }
            else {
                this.style.borderColor = '#d9d9d9';
            }
        })