remove - Restaurando la posición de desplazamiento de página con jQuery

jquery selector

Question

Tengo una operación de página que usa algo como:

$(''#thetable tbody'').replaceWith(newtbody);

en una devolución de llamada ajax. A veces, si el usuario ha desplazado la página hacia abajo, esta operación tiene el efecto secundario comprensible de desplazar la página hacia arriba. Pero el reemplazo parece impecable para el usuario, por lo que es un poco molesto tener que desplazarse nuevamente hacia abajo. Y como el newtbody normalmente tiene la misma altura vertical que la que reemplazó, deberíamos poder hacer que el script lo haga en su lugar.

Ahora, desde que encontré eso ejecutando:

$(''body'').scrollTop(300);

desde la consola del depurador JS hace lo que esperaba que hiciera, pensé que el remedio simple sería:

var scrollsave = $(''body'').scrollTop();
$(''#thetable tbody'').replaceWith(newtbody);
$(''body'').scrollTop(scrollsave);

Pero no hay alegría. No he recurrido a jQuery.ScrollTo todavía.

Answer 1

¿Estás utilizando aspx? si es aspx

$(document).ready(function () {
        //------------ scroll-------------
         
        $(''body'').scrollTop(document.getElementById(''<%=hdScroll.ClientID%>'').value);
            
        $(window).scroll(function () {
            $("#<%= hdScroll.ClientID %>").val($(window).scrollTop());
            //alert(document.getElementById(''<%=hdScroll.ClientID%>'').value);
        });
       });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <asp:HiddenField Id="hdScroll" runat="server"></asp:HiddenField>

Answer 2

Asegúrese de utilizar return false; para terminar su function(){} construya.

El activador de eventos puede estar intentando ejecutar la acción predeterminada del elemento DOM de destino, es decir, < a href="" >;

Answer 3

Intente usar .html() lugar de .replaceWith() :

$(''#thetable tbody'').html( newtbody.html() ); .

No conozco posibles cuellos de botella en el rendimiento aquí, pero funcionó para mí cuando intentaba preservar la posición de desplazamiento de un div, y parece que también funciona bien con la posición de desplazamiento de toda la página.

Answer 4

Periódicamente, puede verificar el div outerHeight y configurar la propiedad scrollTop una vez que la representación div haya cruzado el valor del desplazamiento.

var g_Interval ;
var g_ScrollTop ;

function checkAndAdjustScroll() {
    var height=$(''#content'').outerHeight() ;
    if(height>g_ScrollTop) {
            $(window).scrollTop(g_ScrollTop) ;
            clearInterval(g_Interval) ;
    }
}

Y cada vez que actualice su div con contenido AJAX, haga esto

g_ScrollTop=$(window).scrollTop() ;
g_Interval=setInterval(checkAndAdjustScroll, 100) ;

Es posible que deba realizar ajustes en función del desplazamiento de su div desde la parte superior de la página

Answer 5

Prueba esto: http://jsfiddle.net/utTt4/

Answer 6

Tuvimos exactamente el mismo problema, y ​​el siguiente código funciona muy bien ...

var scroll = $(window).scrollTop();
// yada
$("html").scrollTop(scroll);

Answer 7

var position= $(window).scrollTop();

//some things here

$(window).scrollTop(position);

Me funcionó tanto en IE8 como en FF.