Làm cách nào để ngăn việc cuộn lên đầu trang khi xuất hiện Hộp thoại Giao diện người dùng jQuery?

Question

Tôi hiện đang sử dụng jTemplates để tạo một bảng khá lớn trên máy khách, mỗi hàng có một nút sẽ mở ra một hộp thoại Giao diện người dùng jQuery. Tuy nhiên, khi tôi cuộn xuống trang và nhấp vào một trong các nút đó, hộp thoại jQuery sẽ mở, nhưng vị trí cuộn bị mất và trang sẽ nhảy trở lại đầu trang (với ngăn chặn và hộp thoại thực tế hiển thị trên màn hình). Có ai nhìn thấy hoặc biết những gì có thể gây ra vấn đề này?

Cảm ơn.

Answer 1

Bạn đang sử dụng thẻ liên kết để triển khai "nút" bật ra hộp thoại? Nếu vậy, bạn sẽ muốn trình xử lý nhấp chuột mở hộp thoại để trả về false để hành động mặc định của thẻ neo không được gọi. Nếu bạn đang sử dụng một nút, bạn cũng cần phải chắc chắn rằng nó không gửi (bằng cách trả về false từ trình xử lý) và hoàn toàn làm mới trang.

Ví dụ,

$('a.closeButton').click(function() { 
    $('#dialog').dialog('open'); 
    return false; 
}); 


<a class='closeButton'>Close</a> 

Answer 2

thay đổi mã của bạn như thế này

$('a.closeButton').click(function(e) { 
    e.preventDefault(); 
    $('#dialog').dialog('open'); 
}); 

Answer 3

Bạn có thể thử:

scrollTo(0, jQuery("body")); 

Answer 4

Nếu nút của bạn làm việc với một thẻ html neo với href="#" thay thế ví dụ: href="javascript:;" hoặc bất kỳ phương pháp nào khác mà bạn sử dụng để tắt href. Lý do tại sao việc di chuyển xảy ra là vì href="#" cuộn lên đầu trang của bạn.