Cách tắt nhảy neo khi tải trang

Question

Khi tôi truy cập my_site.com/page.php#something, vị trí cuộn là vị trí của phần tử mang thẻ bắt đầu bằng # cụ thể này chứ không phải đầu trang.

Thi hành window.scrollTo(0, 0); không thay đổi thực tế này. Vậy thì sao?

EDIT: cũng đã thử câu trả lời được chấp nhận từ How to disable anchor "jump" when loading a page?. Dường như không hoạt động nữa.

Answer 1

Có mã HTML này:

<a href="#test">link</a> 
<div id="test"></div> 

Bạn có thể tránh di chuyển đến phần tử div và thay vào đó di chuyển tới phía trên cùng của cửa sổ bằng cách sử dụng mã này:

$("a").on("click", function(e) { 
    e.preventDefault(); 
    window.scrollTo(0, 0); 
}); 

EDIT:

Bạn có thể thử thêm mục này:

var firstVisit = true; 
$(window).scroll(function() { 
    if (firstVisit) { 
     window.scrollTo(0, 0); 
     firstVisit = false; 
    } 
}); 

Answer 2

Việc bạn phải làm là lưu thẻ bắt đầu bằng # để sử dụng sau này và sau đó xóa thẻ để trình duyệt không có gì để cuộn đến.

Điều quan trọng là bạn không đặt phần mã đó trong hàm $() hoặc $ (cửa sổ) .load() vì nó sẽ đến muộn và trình duyệt đã chuyển đến thẻ.

// store the hash (DON'T put this code inside the $() function, it has to be executed 
// right away before the browser can start scrolling! 
var target = window.location.hash, 
    target = target.replace('#', ''); 

// delete hash so the page won't scroll to it 
window.location.hash = ""; 

// now whenever you are ready do whatever you want 
// (in this case I use jQuery to scroll to the tag after the page has loaded) 
$(window).load(function() { 
    if (target) { 
     $('html, body').animate({ 
      scrollTop: $("#" + target).offset().top 
     }, 700, 'swing', function() {}); 
    } 
});